Mike Curtis
Apr 21, 2017 · 5 min read

Everyone starts somewhere, right? Early on in my UX career, I applied the basic principles I had in my repertoire to redesign a website, Paradise with a View. While my UX skills were still in their infant stages, I took what I had learned up to that point and applied my knowledge to the project.

Please note this was an unsolicited project; I have no affiliation with this website or company. I was not asked by Paradise with a View or any of its affiliates to do any work for them. I know… I know… some of you in the UX community hate fake redesigns, but sometimes when you’re just starting out it’s all you’ve got!

That being said, I believe any product, digital or not, can benefit from a user experience process. When I came across the existing website, I felt drawn to see how the site could function, feel, and perform better with its users by simply applying a UX process to it. Think of your favorite travel websites and apps. Why do you like them? Why do you keep going back to them? Here is a screen shot of the existing site, Paradise with a View:

http://www.paradisewithaview.com/

Design Process

Each of my case studies have a UX process that I follow to help me stay on point with my projects; this one was no different. Here are the areas we’ll dive into:

Step 1: Empathize

  • Assumptions & Research

Step 2: Define

  • Competitive SWOT Analysis
  • Information Architecture

Step 3: Ideate

  • Sketching Phase
  • Low-Fidelity Wireframes

Step 4: Design

  • High-Fidelity Mockups

Step 5: Test

  • Usability Testing

Conclusion

  • My Own Feedback

Step 1: Empathize

Assumptions & Research

The first step was to begin researching their website and build a list of the features, pages, and first impressions. I made assumptions about their site based on what I found in their own content and other popular travel & booking sites in the industry. I compiled the information into the list below.

Research and assumptions for the website redesign.

Step 2: Define

Competitive SWOT Analysis

I took these findings and created a competitive SWOT analysis page to show the existing page’s strengths, weaknesses, opportunities, and threats (SWOT).

Information Architecture

Once I had developed a good understanding of their page I focused on the essential, basic structure of their site. I began seeing that while the site has structure, links, and pages, so much content was contained within single pages that it felt overwhelming to find my way around or know where I was on the site without looking up at the address bar in my browser. I formed a hypothesis that I would not be able to make informed decisions on the site due to feeling lost and inundated with information on single page views.

My information architecture diagram below helped me narrow in on two pages that I would be tackling in my redesign: the homepage and one of the room’s pages (room # 1711).

Step 3: Ideate

Sketching Phase

One can’t argue that many of the other travel sites have it figured out when it comes to a landing page for their potential customers. The option to pick a date and book a hotel typically comes up front and center on almost any popular site. I took some of my favorite concepts from various competitors and tweaked them ever-so-slightly to make them my own. I also spent some time coming up with a logo for the site, implementing a review system, and integrating social sharing buttons like Facebook which I couldn’t find in their existing experience.

Low-Fidelity Wireframes

I took my drawings and moved over to Sketch to generate a lo-fi wireframe mockup of the new front page for Paradise with a View.

Step 4: Design

High-Fidelity Mockups

With my wireframe in place, I took to giving the homepage color, style, and pizzazz. I implemented the newly designed logo, a review system using waves instead of stars, and kept a strong focus on imagery and photos like their existing site.

The second page in the redesign explores what the page for one of their rooms would look like. Again, I wanted to keep a strong focus on images, but allow the user to tab through reviews, amenities, and hotel information. I also used tabbed browsing at the top of the room page and came up with an idea for waves to show the active page you were on.

Step 5: Test

Usability Testing

When I got the designs into the hands of users, I was given ideas for a few areas of critique, feedback, and improvement:

  • Watch the size of the icons, they’re a little too big, and inconsistent across both pages
  • Social sharing buttons are big and typically wouldn’t be displayed that large
  • Your new homepage feels a bit heavy on copy (text) and overall content; consider condensing the amount of information on the page

Conclusion

This was one of my first redesigns in my UX career. It was a fun exploration of sketching, wireframes, information architecture, and layout design. While many pieces would still need to be completed on this in the real world, it demonstrated to me just how powerful our jobs are as UX designers. Should time permit, I’d like to revisit this website in the future and clean up my hi-fi work in Sketch to adhere to a grid system, fix icon sizes, and more.

Do you have any feedback for me? What would you have done differently? Please feel free to share your thoughts, suggestions, feedback, etc.

Mike W. Curtis

Portfolio for Mike W. Curtis: Utah-Based UX Designer - For nearly two decades, I've been happily working with people in my career to help them solve their problems. My background in marketing, sales, e-commerce and UX has taught me to make informed & empathetic design decisions.

Mike Curtis

Written by

Dad, husband, UX designer, teacher, and mentor. https://medium.com/mikewcurtis

Mike W. Curtis

Portfolio for Mike W. Curtis: Utah-Based UX Designer - For nearly two decades, I've been happily working with people in my career to help them solve their problems. My background in marketing, sales, e-commerce and UX has taught me to make informed & empathetic design decisions.

Welcome to a place where words matter. On Medium, smart voices and original ideas take center stage - with no ads in sight. Watch
Follow all the topics you care about, and we’ll deliver the best stories for you to your homepage and inbox. Explore
Get unlimited access to the best stories on Medium — and support writers while you’re at it. Just $5/month. Upgrade