UX Case Study: Reaach Website

Reaach is one stop local business directory website. Which provides comprehensive information about local businesses or products. It focuses on freelancers, small and medium size businesses.

Cover

My Role

My role was to process the initial thinking, user flows, wireframes, user interface designs and prototyping.

Target Market

Potential users of this website are anyone who is looking for information about businesses, products and services. They are anyone who lives anywhere in the world.

Key Deliverables

A number of deliverables were required for the project, including:

  • Personas and scenarios
  • Design and usability recommendations for improvement
  • User flows
  • Product sketches and wireframes
  • Prototype of designs

Pain Points

  • The flow to browse the cities was very distractive.
  • Search, filters and categorization interface and business discovery flow takes too long to narrow down and makes the exploring process a big hassle.
  • Searching by keyword provides too many results that are incorrect, irrelevant and not a good fit.
  • Enhance the visibility of related and newly added business profiles or services.
  • Although the font used in the website is modern, it still needs some improvements in typography and spacing.
  • Call-to-action to add a new business is not very clean and a very clear message is required for new businesses.

User Flow

I design a flow that allows a smooth user experience. Given that users may be looking for something specific or be inspired while browsing, any business has the flexibility to add places and create new lists from multiple points in the website.

A normal user flow

User flow as a general user
User flow as a general user
  • An existing user, who is coming back to see the information or get an email notification.
  • A new business owner or representative, who wants to register their business on the website.
  • An existing business owner or representative, who wants to update his business listing.

Registration User Flow

User registration process
User registration process

Wireframes

Now, I have already gathered enough information to get started with the wireframes. I created this set of wireframes of all of the key screens needed to complete the main user tasks.

Mock-up Screens

I used InVision's Freehand Tool to create these mock-ups.

Home Screen
Home Screen
Category Screen
Category Screen
Detail Screen
Detail Screen
Sign In Screen
Sign In Screen

Visual Design & Prototype

Now it is time to proceed with the visual design. I tried to maintain clean design and contrasting colors, but went for a sky blue instead of the darker color. When paired with hints of bright mint, the end result was an interesting and friendly aesthetic.

Cover Design
Home Page Design
Home Page Design for Tablet
Home Page Design for Mobile

Conclusion

Although this product concluded with a solid prototype, I would still like to continue testing and improving the design.

UX Designer & Front End Developer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store