Sansotei

ramen           

DURATION.

NOV 2024 – DEC 2024

TOOLS.

Wix | Figma | Illustrator | Photoshop | Excel

TOKUTSU RAMEN

TOKUTSU RAMEN

BACKGROUND.

Sansotei Ramen is a Canadian brand specializing in authentic Tonkotsu Ramen. It located across the Greater Toronto Area, Ottawa region, Kitchener, Waterloo region and Montreal. The project aims to redesign the website the give it a modern look and Japanese vibe and requires restructuring the map of locations.

MY ROLE.

UX/UI Designer: I redesigned Sansotei Ramen's website and created templates and a visual guide to establish consistency across each page and a cohesive brand identity. Deliverables include 5 hight fidelity screens, each adapted for at least 3 breakpoints, typographic styles, color palette, and templates with precise layout and spacing guidelines.

I redesigned 4 of the main screens for the Sansotei Ramen. The pages included Home, Menu, Media and Locations. The insights showed that the current site in brand identity is not strong enough to leave a lasting impression on customers.

previous website Layout


Issues

  1. The brand image such as color, style and layout are inconsistent.

  2. The Homepage cannot show the product in the area of the company's focus

  3. Some of the content is redundant, outdated, or trivial on the site.

HomePage

Combining distinctive visual and navigational signposts help users recognize and recall the homepage. It allows users to recognize the navigation easily.

Online order

The online order system is one of the main revenue stream for restaurant. Therefore,it is selected on the homepage.

About

According to let user recognize ramen is the main item in their business, I added a ramen image and their identity wave on the back.


Header


The header has been moved from the top to the right side menu, it can now be hidden on any page.

Menu

Simple animations have been added to the menu, enhancing the customer’s experience by offering more than just static texts and images.

Overview.

From a visual standpoint, the interface has been refined with improved aesthetics and integrated animations to enhance user engagement and reduce visual monotony. On the functional side, site navigation has been optimized for clarity. Key content areas are now prominently featured on the homepage, enabling users to efficiently locate and access important sections across the website.