top of page

Baechelin

WEBSITE DESIGN

Baechelin_aboutus
Baechelin_map
Baechelin_home

Barrier-free + Michelin

Baechelin is a website that aims to

find accessible restaurants for people with physical disabilities.

CONTEXT

Baechelin is a website designed to help people with physical disabilities find accessible restaurants to eat. The name Baechelin is a combination of two words; Barrier-free and Michelin.

Barrier-free refers to buildings and facilities designed so that people with physical disabilities can easily access and use them. Michelin guide indicates lists of restaurants with high star ratings for outstanding cooking. The name, Baechelin symbolizes our aim to find Michelin-guide restaurants for people with physical disabilities. 

MY ROLE

Product Designer

UX research, User Interview, Wireframing, High Fidelity Mockups, Design System, User Testing

Designed for Hanghae 99 based in South Korea.

Collaborated with 2 back-end developers,

2 front-end developers and 1 designer.

PROBLEM

People with physical disabilities often face problems accessing the restaurants.

High stairs and narrow entrances prevent wheelchair users from entering the restaurants. Using the kiosk to order food can be difficult for people with visual impairments.​ There is no way of knowing whether the restaurants are barrier-free until they visit them, resulting in a lot of inconvenience and difficulties. 

QUESTION

How might we ensure that people with physical disabilities can find barrier-free restaurants without difficulties?

Research

To answer this question,

we conducted user research to have a deeper understanding of our user group.

Our User Group

We specifically targeted people with physical disabilities aged 18 to 45 searching for barrier-free restaurants. This can include people who use wheelchairs, canes, and mobility scooters, and those with vision and hearing impairments.

User Interview

Our team reached out to possible target users through various channels such as online communities, university associations, and connections through acquaintances. Ultimately, we successfully conducted 4+ user interviews of people with physical disabilities who were interested in finding barrier-free restaurants.

75% experienced difficulty entering restaurants due to inaccessible building design.

There are specific needs in finding restaurant reviews for people with physical disabilities

Existing restaurant review sites do not provide information about barrier-free facilities & services.

25% had trouble using the kiosk and couldn't receive any help from the workers

Personas

Based on the data from the user interview, I created 2 user personas with descriptions of their goal, pain points, and needs to have a realistic representation of our user group for reference. 

Baechelin_persona.png

Competitive Analysis

I researched 3+ restaurant review sites to evaluate their design strategies and identify their pain points to reframe them as opportunities.

Design Strategies

In common, search filters, maps, and review features were used in all 3 websites. which indicates that this is the industry standard for restaurant review websites. I specifically analyzed how different websites designed their menu to filter restaurants based on categories.

yelp

Yelp

Easy access to filters of different categories placed at the local navigation.

mangoplate

MangoPlate

Provides a search filter at the top to categorize various restaurants.

dinningcode

DinningCode

Use hashtags to group restaurants based on the same types of food.

Pain points

Since these websites are not made for people with physical disabilities, it was difficult to know whether the restaurants were providing barrier-free facilities and services. Also, the reviews and star ratings mainly focused on the taste, atmosphere, and overall quality of the restaurant, but not about on the usability and accessibility of the restaurants.

Reflecting on the data gathered from the user research and competitive analysis, our team saw the opportunity to design a product that could create a positive impact on the disability community.

OPPERTUNITY

Crafting a platform for people with physical disabilities to search, access, and enjoy barrier-free restaurants.

Design Process

Now, let's go through the design process step by step.

Feature prioritization

Once we knew what we wanted to build, we selected the key features we wanted to prioritize. Despite many ideas discussed during the team meetings, we focused on creating a straightforward platform where users could find barrier-free restaurants.  

Baechelin_map

Map

Check the map

to find barrier-free restaurants

close to you.

Baechelin_restaurants

Barrier-free filter

Use the barrier-free filters 

to find restaurants with universal building design & accessible services.

Baechelin_review

Reviews

View the tailored reviews of the restaurant from the other users to check accessibility.

Task flow

I created a task flow to show the tasks a user will go through in the process of finding accessible restaurants on the Baechelin website.

userflow

Wireframes

Based on the task flow, I designed the wireframes to focus on the contents, layouts, and functionality of the website that allows users to easily complete the tasks.

Baechelin_wireframe_login
Baechelin_wireframe_home
Baechelin_wireframe_restaurants
Baechelin_wireframe_restaurant_img

Signup/login

Home page

Restaurant detail

Photo gallery

Visual Identity

Inclusive and Welcoming

When we started designing the visual identity of Baechelin, our goal was to emphasize the inclusive and welcoming brand image.

Baechelin_logo

Logo

Logo design symbolizing people with physical disabilities

Frame 873.png

Icons

Key icons indicating the barrier-free facilities and services

스타일 가이드.png

Typography

Simple and clean typeface to increase legibility

High fidelity prototypes

After creating the design system, we incorporated the designs into our wireframes to develop high-fidelity prototypes.

Baechelin_login
Baechelin_restaurants
Baechelin_restaurant_detail
Baechelin_restaurant_img

Signup/login

Login with existing social accounts for the convenient and fast login process

Home page

Search restaurants using barrier-free filters and view top rankings 

Restaurant detail

Check the accessibility of the restaurants by looking at targeted reviews

Photo gallery

View the photos of the restaurants in detail

After months of sleepless nights working on this project, we finally launched the website!

Final Product

Baechelin optimizes the restaurant search experience for people with physical  disabilities by providing three key features: Barrier-free filter, specified review tags, and maps.

1) Barrier-free filter

Screen Shot 2024-02-15 at 11.12.16 PM.png

Use the barrier-free filters 

to find restaurants with universal building design & accessible services.

Baechelin_filtered_restaurants

Users can easily identify and filter restaurants that provide accessible services they require.

2) Specified review tags

Screen Shot 2024-02-15 at 11.17.23 PM.png

View reviews with specified tags to check the barrier-free facilities and services the restaurants provide.

Baechelin_restaurant_img
Baechelin_restaurant_detail
Baechelin_review

Leave your own reviews and star ratings based on how accessible the restaurant was.

3) Maps

Baechelin_map
Baechelin_filter

Check the map

to find barrier-free restaurants based on your current location

User Flow

Baechelin_login
Baechelin_restaurants
Baechelin_restaurant_nearby
Baechelin_restaurant_detail

Signup/login

Home page

Rankings

Restaurant detail

arrow
Baechelin_restaurant_img
Baechelin_map
Baechelin_restaurant_detail
Baechelin_review

Photo gallery

Maps

Restaurant detail

Review

User Testing

After launching the product, we sent out a survey through online communities and social media to check the usability and receive feedback from the users. We asked the participants to accomplish the task of finding barrier-free restaurants near them and answering the survey based on their experience.

 

As a result, we received 38+ survey answers and this is the summary of the result.

86% said barrier-free filters were the most useful feature

"The design is simple, vibrant, and intuitive"

"Home page feels too crowded with a lot of information"

31% wished there was community feature where people could connect with each others

CONCLUSION

Conclusion + Takeaways

This was my first website design project completed as a team. I collaborated with the developers and designers to plan, design, and launch this website. There are few things I learned throughout this project.

1. Be open to other people’s opinions. At the beginning, we had to go through so many meetings to figure out the concept that everyone agreed on. It is important to listen to everyone’s opinion and find out the best ideas and solution

2. Actively communicate with team members. While working with developers, I asked many questions to check whether they could actually develop my designs through coding.

3. Focus on completion, not perfection. Due to the short time frame and technical limitations, we had to make some compromises to our design while trying our best to produce quality final product. Although this project is not perfect, it is important to acknowledge our hard work to actually launch the website and conduct user testings.

bottom of page