top of page
ShippingToGo logo

ShippingToGo

UX based on client's research | Digital wireframes | High-fidelity prototype

⁉️ What is ShippingToGo?

PROJECT OVERVIEW

Background

ShippingToGo allows the user to compare between different types of shipping methods and services around the world and offers a solution for sending parcels.

PRODUCT & UI/UX DESIGNER

My role

The client already conducted a small research, I based my job on his research - persona, user story, problem statement, paper & digital wireframes and high-fidelity prototype.

THE BEGINNING

Problem

Users don't know their package delivery options and don't have a proper platform that compares prices and decides for the user what's the best for his needs.

THE BEGINNING

Solution

Responsive website with a personal area to compare and manage package deliveries, stores delivery history and saves money.

ShippingToGo desktop mockup

💫 Design process

🔍 Who is the user? What he wants?

💞 EMPATHIZE

Research findings

Swipe me! 👉

💞 EMPATHIZE

User story

ShippingToGo user story
ShippingToGo persona

💞 EMPATHIZE

User persona

Marta is a married woman who has a successful online business. She sells many items to many countries around the world every day. She can't find the best solution for sending parcels easily. She also wants to have a way to compare fairly the shipping methods she can use.

ShippingToGo desktop mockup

🧭 Navigating creative solutions

🎯 DEFINE

Problem statement

Marta is an owner of a successful online store who needs to send parcels, compare between shipping methods and get the best one because she needs to efficiently manage her business

💡 IDEATE

Paper wireframes

The ideate phase contains some serious steps in the way to a final product. First, I started sketching some ideas for the home page using pencil and a paper and using the client's desires. After I have five different sketches in front of me, we started brainstorming on the sketches and finally decide on the main structure of the product.

 

*These paper wireframes are not authorized to be displayed here because of contracts between the client.

💡 IDEATE

Digital wireframes

After we decided on the basic structure of the product, I started to sketched it on Adobe XD and design digital wireframes. In this part, we can see how elements in the product should appear and organized. The next step is to create a low-fidelity prototype, which indicates us how the user should interact and move through the product.

 

*These digital wireframes are not authorized to be displayed here because of contracts between the client.

🎨 Crafting stories through design

📲 PROTOTYPE

High-fidelity prototype (UI & design system)

UI Design | Interaction Design | Visual Design | Design System | High-Fidelity Prototype

📲 PROTOTYPE

Visual & UI design

ShippingToGo responsive mockup
ShippingToGo responsive mockup