The task for this project was to redesign the website from my hometown or a town nearby, and create a new Home page, Tourism/Visitors page, and a chosen tertiary page to improve its user interface. I chose to focus on the website for Langley, Washington—a small seaside town on Whidbey Island that I visited many times in my childhood. Because Langley is already dependent on tourism as its main source of income, I decided to approach the problem with the goal of attracting more visitors to increase revenue.
Langley's principle economic activity is tourism.
In 2017, total sales within the city of Langley added up to $47 million.
Revenue in sales and lodging taxes collected during the first quarter of 2018 showed some of the best monthly figures over a 10-year period.
Redesigning the Langley website will lead to an even greater increase in tourism.
My research for this project was in three main categories—researching the original website content, the target audience, and competitors/inspiration.
The Langley redesign is marketed towards Washington State locals looking to go on mini-vacations from their city life. The target audience for the Langley redesign was middle aged middle-class couples, often with children. Their interests involved being outdoors, arts and crafts, and supporting small businesses. This is supported by the array of local shops in Langley, of which there are a fair number of small boutiques, art galleries, whale watching companies, and breweries, as well as a children’s museum.
For competitor research I looked into other small artsy and/or beach-side towns in Washington which were similar to Langley. Of the competitor towns I looked at, the level of design on their websites varied quite a lot, and because they weren’t wholly inspiring, I also looked at some websites on the awwwards site as well to get inspiration. These inspiring sites are included in my moodboard below.
Although the colors on the websites I used on my moodboard didn’t match my design, the individual ideas they portrayed were ones I implemented in my redesign. This step was highly influential in my design as a whole, but the ideas I got from this step also underwent a lot of changes before I arrived at my final design.
Another one of my early steps was building the sitemap for the redesigned website. This step helped me conceptualize the new website as a whole before I began designing.
The first step of my iterative design process was creating sketches of my web and mobile designs. This part was crucial for me in figuring out my general direction, as it gave me more versatility and the ability to make quick adjustments to my early designs. For my personal process, it’s very important for me to start by working on paper.
Home and Visitor Page Evolution
During the course of the project I completed five rounds of iteration before arriving at my final design. Below are several iterations of the Home and Visitors pages showing how the designs evolved over time. Overall this page got simpler, using small spot colors and more white backgrounds.
Itinerary Page Evolution
Of the three pages I made for the Langley redesign, the tertiary Itinerary page was the one that changed the most. My goal with the itinerary page was to make something visually different from the other two pages, and more experimental and interactive to use. The concept for this page was that visitors would be asked to answer a short set of questions and be rewarded with a pre-made itinerary suited to their needs. The goal of this page was to increase the amount of people who visited Langley by providing a simple and personalized list of local attractions.
Overall, I got quite positive feedback from my usability tests. The general feedback was that the layout was clean and easy to use, with only a few snags that needed fixing.
One of those snags was with the itinerary page. On the earlier iterations, the Itinerary page did not appear on the main nav bar, but was a subsection of Planning instead. As a result of this, people were confused on how to get there outside of clicking on the interactive photo on the Visitors page. To fix this problem I changed the sitemap slightly and deleted the Planning page altogether. This meant that the Itinerary page now showed up on the main nav and footer nav where Planning had been, and the main navigational issue was solved.
The other most common complaint I got from user testing wasn’t on the usability but on the color scheme of the interactive maps, which on version four were a mint green. The advice universally was to change the color to match the rest of the page better, and so that was one of my changes in the final version.
The biggest challenge that I faced in this project was my lack of experience in designing websites. The research part of this project was crucial to me because I needed to find as many references as I could to learn what both standard city websites and cutting-edge modern websites looked like. Another concern I had was in translating between desktop and mobile layouts, and in that regard I was totally dependent on the research I did as well.
The second biggest challenge I faced was learning how to use a new software, Sketch, while working on the project. I was thankful that it was similar in a lot of ways to illustrator, but it was frustrating trying to work around the limitations of the software. However, as a prototyping tool, Sketch was great for user testing and I’m sure I’ll like it more as I get to know it better in the future.
One of the things I learned from this project was how important it is to understand the interests of your target audience before you even begin designing a website. I felt that this project was defined by who my target audience was, as that was the main consideration in most if not all of my design decisions.
Another thing I learned was how necessary the process is in designing a website. With other fields of design its possible to work out of order, but with web design that way of working is nearly impossible to pull off. My final product was successful only as a result of all the work I put in at the beginning to understand my goals and competition.
I learned a lot about how to design a website from this project, and I also learned how much I still need to work on in the future. If I had more time I would have loved to try and push my design to be a little more unique and experimental, but as it was I focused most of my efforts on how user-friendly the site was and how it would be received by the target group.