OjaExpress

landing.png

Background

In Summer 2018, I interned at OjaExpress as a UX Designer for 3 months. OjaExpress is an online store to order ethnic groceries for the same day delivery for Chicago areas. Fortunately, this summer I had an opportunity to work with the Web developer at OjaExpress to redesign the website considering the cultural differences of various ethnicities and to provide the users will a hassle-free, transparent, and time-saving shopping experience. While I was mentored by the senior web developer, I designed and produced various deliverables from my design process. This internship helped me to gain experience in designing cross-cultural Interfaces.

My Role

I was mainly responsible to redesign their online website by optimizing the shopping experience of the users. I provided user analysis reports, usability reports, wireframes, and mockups as a part of my deliverables. Through this internship, I was able to understand how UX strategies should be aligned with the business objectives which in turn will help the business to achieve its goals and visions.


Tools: Figma, Sketch, InVision, VoiceOver, Adobe Acrobat.

Outcome

 

Process

process.png

Investigation

In order to make sure that the designs are effective cross-culturally, we need to research about the users’ interpretations based on their culturally different UI patterns, background, their needs, goals, values and their behaviors. 

quote.png

Research local and international UI Patterns

Keeping Hofstede’s cultural dimensions theory in mind, various online ethnic grocery stores were studied to see the differences in the UI patterns.

comp.png

Based on the competitive analysis of other similar websites with different culture and ethnicity, below are some of the common design observations:

• The Home page should always give an idea of where to being with. The users need a start point which is in context with their end goal.

• To being with, the users should be provided with all the required information on the Home Page for their first step.

• Displaying some of the most popular products or samples of them on the Home page gives an idea about the items sold on OjaExpress. This earns the trust of users to at least use the website.

• We need to let users browse through the items based on ethnicity and categories.

• We need to have a search bar.

goals.png


Conducting usability tests

I started the usability analysis of the current design by analyzing the current website through different methods that will help to detect the general usability issues. I decided to choose users of different cultural and ethnic background. The users selected have experience with similar grocery shopping websites and they have shopped from other similar companies in the past.

Direct observation and Contextual inquiry: In this method, I let the users interact with the current website and observe their interactions. I also included the think aloud technique where I asked the users to share their thoughts while interacting with the website.

Notes from the User Interviews

rules.png

Translation

Analyzing the Data – both quantitative and qualitative – to make design decisions. Building information architecture, user flows, and interface design.

Results from the Direct Observation and Interviews

  1. The home page should have some details which will give an idea about the type of the groceries, or the stores that are available in the website.

  2. Having categories, subcategories based on ethnicity makes the experience more goal focused.

  3. Including a search bar on the home page is necessary for a quick search.

  4. In addition, we need to make sure that the information about the areas served should be displayed on the home page.


HTA.png

The user gets three ways to choose the Grocery item based on:
Regions: Here, all the regions are covered which makes it Universal. On the home page, there are continents displayed with the cascading menus. For example, the Continent African has the top 10 populated countries displayed in the sub menu of Home page. If the country is not in the top 10, the user on click on See more. See more is underlined because it is a link which is clickable.  The next page displays all the Countries to choose from. Once the Region is selected, all the items related to that region are displayed. Further the user can choose the item from the categories filter.

Category: Once the user chooses the category, all the items from that category are displayed for all regions. Further the user can filter the regions or sub categories.

Search bar: Displays all the related items from the key word of the search for all regions and categories. Further, the user can filter based on sub category and regions.

Implementation

one.png

two.png