MFMart - Dionne Mok

• MFMart

An eCommerce platform specializing in authentic Asian groceries and household items, offering customers a diverse selection of products.

Overview: https://morefoodsmart.com/

More Foods Mart is a hybrid online and physical grocery store specializing in Asian foods and household items. Our web interface prioritizes user-friendly navigation and effortless product discovery to deliver a seamless shopping experience.

Timeline

2022, 4 weeks

The User

Canadian consumers seeking Asian food, snacks, and products

My role and who I work with

Web designer working alongside a brand designer (Janice Chen), a client and project manager

Tool Used

Figma (desktop, tablet, mobile), Shopify, Front-end (html, css, js), Slack

Challenges

My main challenges included creating a user-friendly platform for a new business without an established brand or customer base. Additionally, I had to efficiently categorize and organize over 100 products for easy customer access. Accommodating a diverse audience with various cultural backgrounds and preferences was also complex, considering More Foods Mart's local presence in Vancouver.

Solution

To enhance the online shopping experience, we'll simplify navigation by organizing products into clear categories and implementing a user-friendly search bar. On the homepage, we'll prominently feature sales and promotions for easy access.

Additionally, we'll personalize the experience based on customer preferences using cookies and tracking. Our improved design, including a clear menu and mobile optimization, ensures a smoother product discovery and checkout process. Prioritizing clean usability and visual consistency is essential for building trust in e-commerce design.

Impact and results

Within three months of launching the website, Google Analytics revealed that nearly 60% of users are engaging with the sales page upon their initial visit. This has significantly increased the business's visibility and attracted a substantial number of new customers.

Research • Moodborad

We began by conducting a branding workshop with the business owner to gain a deeper understanding of the company's identity. Here's what we discovered:

More Foods Mart (MFM) is a new local business in Vancouver, BC, dedicated to establishing a memorable and meaningful brand identity. Our goal extended beyond a simple logo; we aimed to create a consistent color palette and tone of voice that would distinguish us and resonate with our target audience.

To ensure our branding aligned with our website design, we collaborated closely with another designer and the client to develop a unified brand.

Tone: Informative, inspiring, trustworthy Voice: Friendly, approachable, authentic

More Foods' tone and voice are carefully crafted to instill trust, build credibility, and cultivate loyalty and advocacy among its audience.

UX design focus on...

Intuitive Navigation

The website's user-friendly navigation system makes it easy for users to find products using a straightforward menu and precise search function.

Clean and Simple Layout

The website's clean and simple layout enhances browsing and product discovery, emphasizing high-quality images and clear descriptions.

User-Friendly Checkout

The checkout process is user-friendly, with a streamlined layout that guides users through transaction stages and allows for easy addition or removal of items from the cart.

Mobile-Friendly Design

The website is fully responsive and optimized for mobile devices, ensuring that users can access the site and make purchases from their smartphones or tablets.

Design • Wrieframe

In the web & mobile design phase, I conducted user and market research yo learn from similar platforms. Then, I sketches wrieframes and organized the sitemap for easy navigation.

After multiple feedback rounds, test and improvements, I finalized the UX design and applied the visual elements like the logo, images, and colors to the interface.

Reflection

Insights • Key Learnings

Simple and Clean Website design

A simple and clean design helped to improve the user experience, increase customer satisfaction, and attract new customers to the business. By providing a clear and professional image, easy navigation, and improved loading times, More Foods Mart can create a positive first impression with customers, which can help to build a strong brand reputation over time.

‹ ACSEA Store

› Kako Floral

If you like my work, drop me a line to say hi .If you like my work, drop me a line to say hi .If you like my work, drop me a line to say hi .