YesPls
Crafting an e-commerce marketplace
In this project the goal was to build a complete e-commerce marketplace including a buyer, seller and admin platform. My role was lead designer in a team of five other designers with backgrounds in user experience and interface design.
Our approach was to start with a design discovery workshop to understand business objectives, target audience, technical constraints, and how it all should be administered with external APIs like payments and logistics.
- Timeline
- 5 months
- Role
- Lead design
- Product design
- Client
- YesPls
- Industry
- E-commerce
- Marketplace
The challenge
Building relationships between different service components
One of the trickiest parts in this project was to connect three different platforms with various user journeys and touchpoints into a complete service design.
We therefore decided early on to use a service blueprint and swimlanes to map out how different actions of a user in one platform could be directly tied to touchpoints of another journey in another platform.
Design discovery
Starting with stakeholder interviews
Once we had understood the design brief and technical documentation, we organized a design discovery workshop and stakeholder interviews to align features with expectations.
This helped us to quickly map out features to proto-personas, value propositions and touchpoints to establish high-level customer journeys onto a service blueprint for each platform.
- Understand objectives from various stakeholders
- Map out features and sort them by interactions
- Collect awareness around technical constraints and APIs
- Build knowledge about target audience and create proto-persona
- Establish value propositions to user needs and functions
Low-fidelity wireframes
Validating user journeys and service components
When information architecture and a service blueprint for each individual platform were in place, we set out to create low-fidelity wireframes for all required modules and featuresets.
This helped us to validate user journeys and create simple wireflows to understand how different touch points could affect the outcome of interactions on another platform.
- Knowledge helped us arrange information architecture
- Directions helped us start sketching out high-level wireframes
- Competitive audit gave us ideas on how to solve complex user journeys
- Wireflows showed connections and interactions between platforms
What happens when someone is not logged in with delivery and shipment cost, maybe there need to be default price based on location.
Journey mapping
Understanding cross-platform touchpoints
Once our low-fidelity wireframes for each platform were mapped out as a visual representation, we started with journey mapping for some of the more complex user flows.
These were touchpoints and interactions of services that were stretching across multiple platforms or APIs with different users involved like logistics, settlement, return and replace.
Agile design
Mapping out service design
We decided that our approach would be to design a minimal viable solution first, which meant to find a product, put it in a basket and finally purchase it and get it delivered to a door.
With an agile design process we started mapping out high-fidelity wireframes for each service design module in our blueprint, both for a seller, buyer and finally the admin.
Prototyping
Testing and design critique
For each separate set of wireframes that was representing a service module, we also created quick prototypes to validate and test how interaction could behave in a final product.
This helped us to quicker iterate and find a design with better user experience. We also conducted design critiques with product managers, engineers and other designers.
Responsive web
To scale up mobile design
To reduce time and to make our design more scalable, we early decided that we would design interactions, content and layout for mobile first.
This helped us to use the same design language and interactive behavior for native applications, responsive desktop and adaptable mobile interfaces.
Concept design
Bringing all pieces together
My focus was to bring life, structure and design for the buyer marketplace as seen in this case study, but there was equally as much work to make the accompanying platforms aligned.
In each design sprint we therefore had to design, test and create output for user journeys and flowcharts across multiple service components to make it all a unified experience.
The result
A complete e-commerce marketplace service
This project was challenging as it literally tested my skills and knowledge of how to shape complex design that spans over multiple service components and platforms.
At the end we manage to deliver a complete e-commerce marketplace with information architecture, design system, and visuals for both mobile applications and responsive web.
- 3
- Platforms
- 110
- Modules
- 46
- Wireflows
- 2360
- Screens
