Company WEbsite REdesign and Logo rebrand
This project was a part of a rebranding of a local company in 2018. As a part of the process, I collaborated with the owner of the business to redesign the entire website and its content, as well as design new visual assets such as logos, page layouts, and deliverables for clients. The goal of this project was to present a focus on the five key steps of projection mapping: Content, Mapping, Projectors, Surfaces, and Audio. By redefining the visual cohesion of the logos that represent these five steps, and carefully guiding the user through the website efficiently, we were able to restructure the approach of discussing projection mapping with clients.
Research And Planning
To decide what direction we wanted to take the website, we first had to analyze the strengths and weaknesses of the previous website design. The website had a clear and concise goal to make the “Contact Us” page the final page visited and present a call to action. However, the means to prime the user with relevant information was lacking. We wanted the user to easily digest and memorize information so that when they reach the “Contact Us” page, they had a better idea of what specifically they wanted to talk about.
Considering the pictures of the website before the redesign below, what stands out the most is the copious amount of information, amongst a simple navigation. However, the information presented is not strongly tied with a visual theme, which is important for branding the company. The layout also felt inefficient and needed to utilize the space of each page better.
Furthermore, we wanted to create a stronger brand presence on the website. While the old website did feature five, color-coordinated icons that represented each respective category, we took the opportunity to redesign the icons so that they all had visual cohesion with each other. Our plan was to use these icons not only to represent the five categories, but to also incorporate these into curated “scenes” to demonstrate what a typical projection mapping set up would look like. The images below are the old icons and scenes that were used in the website.
Redesign and Implementation
After we decided on a layout and theme for the website, I spent time designing the visual assets in Adobe Illustrator and Photoshop. Then, using Wordpress and various plugins, I reconstructed the website, built new pages that focus on specific projects, and uploaded all of the new assets. Below are pictures of the redesigned website.
The images below are the newly redesigned icons, as well as example scenes in which they all narrate the process of projection mapping.
With the new design of the website, users are able to navigate to the parts that they feel are most important to learn about. Dedicated sections of the website were created to deliver relevant information, such as case studies that elaborate on specific projects, the five step categorical process of projection mapping, a media gallery overview of past projects and finally, the contact page. In the end, the goal to lead the user to contact the company as a call to action was still prevalent. However, with the improved design, users were able to seek out what they needed before they decided they were ready to make the connection.
Date of Project: June 2018-September 2018
My Role: I redesigned visual assets such as the categorical icons (monitor, projector, computer server, building, speakers), website banners, background images and video splash images. I was also responsible for using Wordpress plugins to create the layout and formatting for the website. I also collaborated with the owner of the company during the planning and evaluating process.
Technologies and skills used:
Worked one on one with the owner of a company to deliver a new vision of the company’s brand.
Created flowcharts, navigation menus, and breadcrumb menus to analyze the best way to layout the user flow of the website.
Used Adobe Illustrator to create vector graphics of icons and images within a coordinated theme.
Used Adobe Photoshop to create and edit graphics and background images.
Used Wordpress and various plugins to restructure and develop the website.
Solution: The purpose was to create a new and iconic brand for this local company so they can better demonstrate their service. Projection Mapping is a relatively new technology that many clients do not fully understand, so the ability to visually explain the process of creating a projection mapping event is very useful when reaching out to clients about their ideas.
For a full demonstration of the new website, please visit at the link below
Website Redesign