Ecommerce Shopping Website Design
Project Overview
Shop website allows consumers to directly buy goods from a seller over the Internet using a web browser. Our responsive website fit the screens of Mobile, Tablet & Desktop. And building out a smooth navigation system that is simple and user-friendly is a great way to maintain our customers and keep them on our site with clear information for people who are new to technology.
Project duration:
September 2022 to November 2022
The Problem:
Migrating peoples to use new technology lowers the risk of being outdated as they can continuously update to match up the latest advancements. Our research team has identified 75% of middle aged group lack of knowledge in new technology(e-commerce websites, secure online payment gateways)
The Goal:
Design an website that will represent easy online shopping experience and manage to order online products for people who are new to technology
Responsibilities
Conducting interviews, paper and digital wire framing, low and high-fidelity prototyping, conducting usability studies, accounting for accessibility, iterating on designs and responsive design.
User research: summary
I conducted user interviews, which I then turned into empathy maps to better understand the target user and their needs.
I discovered that many target users treat online shopping as a fun and relaxing activity when they need to order products.
However, many online shopping websites are overwhelming and confusing to navigate the right product, which frustrated many target users.
This caused a normally enjoyable experience to become challenging for them, defeating the purpose of relaxation.
Persona 1: Grenville Davis
Persona 2: Lena Williams
Design Process
Ideation
I did a quick ideation exercise to come up with ideas for how to address gaps identified in the competitive audit. My focus was specifically on easy online shopping experience and manage to order online products
Design System
Low-fidelity prototype
Usability Study: Findings
These are main findings in the usability study
Mockups
Added text to Sign In button, Cart button & Search box
Before usability study
After usability study
Added extra payment options (EMI, Wallets)
Before usability study
After usability study
Mockup (Mainpages)
Mockup (other pages)
High-fidelity prototype
Accessibility considerations
Information Architecture
Sitemap
Shop responsive website sitemap to guide the organizational structure of each screen’s design to ensure a cohesive and consistent experience across devices.
Responsive designs
Desktop
Tablet
Mobile
Impact
Users shared that responsive website has simple navigation to order the product. Responsive design fits their screen, easy to interact in the website
What I Learned
I learned that even though the problem. I was trying to solve was a big one, diligently going through each step of the design process and aligning with specific user needs helped me come up with solutions that were both feasible and useful.
Thanks for watching
Foodie – Food Ordering App
From the designers and engineers who are creating the next generation of web and mobile experiences, to anyone putting a website together for the first time. We provide elegant solutions that set new standards for online publishing.
Digital technology has made our world more transparent and interconnected, posing new challenges and opportunities for every business. A holistic, user-centric perspective is what truly sets one apart.
Mockup
Content Marketing
From the designers and engineers who are creating the next generation of web and mobile experiences, to anyone putting a website together for the first time. We provide elegant solutions that set new standards for online publishing.
Digital technology has made our world more transparent and interconnected, posing new challenges and opportunities for every business. A holistic, user-centric perspective is what truly sets one apart.
How We Work
From the designers and engineers who are creating the next generation of web and mobile experiences, to anyone putting a website together for the first time. We provide elegant solutions that set new standards for online publishing.
Digital technology has made our world more transparent and interconnected, posing new challenges and opportunities for every business. A holistic, user-centric perspective is what truly sets one apart.
Optimization Statistics
From the designers and engineers who are creating the next generation of web and mobile experiences, to anyone putting a website together for the first time. We provide elegant solutions that set new standards for online publishing.
Digital technology has made our world more transparent and interconnected, posing new challenges and opportunities for every business. A holistic, user-centric perspective is what truly sets one apart. together for the first time. We provide elegant solutions.
From the designers and engineers who are creating the next generation of web and mobile experiences, to anyone putting a website together for the first time. We provide elegant solutions that set new standards for online publishing.
We Will Be Useful to You
From the designers and engineers who are creating the next generation of web and mobile experiences, to anyone putting a website together for the first time.
Digital technology has made our world more transparent and interconnected, posing new challenges and opportunities for every business. As your budget progresses and evolves, continue referring to your SMART objectives. Stay focused and remember your goals – they will always inform what your next step will be!
From the designers and engineers who are creating the next generation of web and mobile experiences, to anyone putting a website together for the first time. We provide elegant solutions that set new standards for online publishing.
Cum et essent similique. Inani propriae menandri sed in. Pericula expetendis has no, quo populo forensibus contentiones et, nibh error in per.
As your budget progresses and evolves, continue referring to your SMART objectives. Stay focused and remember your goals – they will always inform what your next step will be!