Yiadom Shipping Services Responsive Website Design
Project Overview
The Product
A responsive website (Desktop and Mobile) for a freight-forwarding business
Project Duration
Two Weeks
My Role
Lead UX Researcher and Designer
Responsibilities
Ideation, User Research, Wireframing, Prototyping
The Problem
(1) Yiadom is a busy freight-forwarding business owner who needs a responsive website to track customer pick-up orders and shipment status because organizing on paper has become difficult to manage, triage, and track efficiently.
(2) Serwaa is a elderly woman moving back to Ghana after retirement who needs an easy responsive website to help her get her items shipped to Ghana because she is not tech-savvy.
The Goal
The goal of this project is to design a responsive website that creates an easy and responsive way for customers to request shipment pick-up, total cost of shipment, and view shipment status. This project will also enable the business owner to track and manage customer shipments efficiently through an easy to use responsive website.
User Research
Summary
Background: Currently, Yiadom (Business Owner), is a freight forwarder who ships his items from the United States to Ghana. Currently, customers call the phone numbers of Yiadom and his employees to make a request for shipment pick-up by phone. These requests are written on paper in an invoice booklet, and then attended to as remembered. Shipments are then packaged up into a container, and customers can generally expect their items to arrive in Ghana 2-3 months after the container is packed.
Type of Research: Interviews of Business Owner and Customers
Assumptions: I assumed that customers would prefer having a website to use in order to be able to make orders at any time, but after talking with customers, I realized they liked the phone system because it allowed them to be more flexible on item pick-up and prices, and was easier to navigate than the app. Making sure that these experiences are better integrated into the app is important in creating a better customer experience.
Pain Points
Need to Make Requests For Shipment Pickup
Customers need a way to get their shipments picked up so they can be shipped, this is the main function of the app, and main source of revenue, so this will need to be highlighted in the design.
Need to Track Status of Shipments
Customers want clear transparency on when their shipment will arrive, and want to see how far their shipment is from the destination. Design will make sure to have a clear way to track shipments of a shipment once a customer makes an order.
Need to Aggregate Customer Data for Pickup
Yiadom needs to be able to look at the customer data collected from the app to be able to understand what items need to pick up, what materials and resources would be needed to complete pick up, and which area the pickup is in.
Persona: Serwaa Akoto
“The technology is for the young people to use, we older people, it’s difficult for us to use without someone helping us.”
63
Age:
Family:
Her + Her Husband
Hometown:
Bronx, NY
Occupation:
Retired LPN
Education:
Associate’s Degree
To request pick up of her items and know what day pick up can happen so she can plan accordingly
To track status of shipment of items
To know total cost of shipment before finalizing purchase
Goals
Frustrations
Not knowing when shipment will arrive, or how far it is
Having difficulty reaching Yiadom/employees to start shipment process/ request pick-up
Having to call to make adjustments to shipment pick up or changes.
User Journey Map
I made this journey map to show how a customer moves through the site from start to finish. The point was to see what steps they actually take, where things start to feel confusing or slow, and which parts matter most to them. By laying it all out, I could spot the tasks that are necessary, the ones that feel like extra work, and the places where the experience could be made a lot smoother
Design Process
Paper Wireframes
When sketching the paper wireframes, my goal was to explore how the webpage could feel simple and easy to use, while still being dynamic and interactive enough to keep customers engaged. I wanted the design to strike a balance of being clear and straightforward, but also intriguing so users would want to keep exploring.
Digital Wireframes
With the digital wireframes, I focused on making the main functions of the website easy to find and use, while keeping a personable feel throughout the design. I added multiple access points for key actions and used large buttons so the core functions stood out right away. To make shipment tracking simple, I included both a visual progress bar for a quick glance and large text underneath for a clear, immediate overview
Mock-Ups
For the mockups, I aimed to create a calming feel through both color and typeface. I used blue throughout the page, incorporated Twi to make the experience feel more personalized, and added an About section to put a face to the business. I also included more labels and pictures to balance visuals with text, making the information easier to take in. To keep shipment details clear, I added dividing lines to break up the text and make it easier to read at a glance.
Accessibility Considerations
Headings
I used consistent headings so that individuals using screen readers will be able to navigate the page easier
Text Size
I made the text larger throughout the entire website to make the text easier to read
Typeface
I mainly used a sans serif typeface to make sure that readability was clearer
Going Forward
Impact: This website will help streamline company operations by making it easier for customers to place orders and request item pickups. With a clearer process and more accessible features, the business can handle more requests efficiently while giving customers a smoother experience
Key Takeaways: One key takeaway was understanding the differences between designing for mobile and web—deciding which smaller elements are essential on a limited screen versus what can be expanded on a larger one. I also learned the importance of creating a cohesive design across pages, and overall I now feel more confident in my ability to design a complete website experience.