Siid.com

All-in-one order management
& shipping platform.

  • Role Lead Product Designer
  • Client Siid, UK (under the umbrella of Obodo.co.uk)
  • Year 2020-21
Siid-Cover4b
My Role
Stakeholders Workshops
User Research
Journey Mapping
Service Design
Wireframing
Interaction & Visual Design
Design System
Project

Siid is an all-in-one solution for order management and shipping that is geared toward assisting small and medium-sized eCommerce businesses streamline the shipping process.

Between the October ‘20 and the November ‘21, I had been working on the design of the Siid.com web app. As the Lead Product Designer, it was required of me to work on multiple aspects of the project, beginning with the early workshops and ideation process and ending with the preparation of full documentation of the design system, overseeing the work of the developers, and creating a roadmap for future releases. This was all part of my job description.

Siid-Cover
Approach

From a single-sentence idea to a shipped product.

We have begun the process by holding a series of workshops with key stakeholders. Sam Hardy, who was the Head of Design at Obodo, and I have been in charge of facilitating these workshops. As a result of the discovery, I have begun working simultaneously on key aspects of the project in order to get our feet off the ground. These key aspects include the Service Design of the main areas of the app (which were established during the workshops), a timeline for the initial release of the MVP, and an early prototype to validate our hypothesis with potential users (interviews were facilitated by Laura Farrant).

Siid-Map1
Siid-Map3
Siid-Map2
What was done
Main Functionalities
User facing
Registration & Self-onboarding
Orders panel (from multiple marketplaces)
Product directory (a hub for all eCommerce platforms)
Shipments request & overview app
Pick and Pack
Custom tracking
Pricing add-ons (with custom rules)
Configurator & Backoffice tool
Siid Admin tools
Pricing tool (external cost + add-ons)
Subscription bundles configurator
Control center for carriers' accounts
Invoicing
Users overview & support system
Backoffice with multiple permissions levels
& much more
Siid-Map
Siid-Cover2
Siid-components
After the user research

Addressing users' needs.

User testing was performed not just on the customers who had already been lined up for the MVP release but also on a few persons who had been specifically recruited for the purpose of completing this work. The feedback as a whole was overwhelmingly positive; however, a few possible difficulties were pointed out: the app itself was enormous, and users would possibly be dealing with hundreds of orders each and every day. I have proposed and implemented a new component that will be used throughout the app to help ease their uncertainty. This new component is an "Omni power button" called "Manage," and it will allow users to carry out key actions in the context of the current content of the app as well as their current selections. I have done this because I want to make the app more user-friendly overall.

Siid-old_new
Design process

Being flexible from the very beginning.

I've started the design process with a temporary by default art direction. At this stage of the project, not only did we not have an idea of how the branding would look, but we also did not have a settled name for the project. To begin conceptualizing what the Siid app may become and as a tool for presenting a more attractive prototype for user testing and interviews, the first aesthetic direction served merely as a driver. In the beginning, my objective was to construct a collection of components that would eventually form a proper design system. This would allow us to streamline the early design process to the greatest extent feasible.

As soon as the brand guidelines arrived from the external agency, I did a week-long sprint to transform them into an initial set of styles for the design system. I also did some tweaking and polishing (while maintaining communication with the branding agency) to ensure that everything was in line with the accessibility guidelines. After that, there was a lengthy workshop with all of the main stakeholders, during which the art direction was agreed, and then the fun part began...

Siid-img-14
Siid-img-10
Siid-img-12
Siid-img-7
Siid-img-8
Siid-img-11
Siid-img-13
Siid-img-9
Siid-img-6
Siid-img-5
Siid-img-1
Siid-img-2
Siid-img-4
Siid-img-3
Design system

Designing for the present and the future.

As soon as the user testing was over and the final branding was decided upon, I got to work on Siid's design system and have been doing so pretty much continuously since then. Even at the MVP level, Siid was a massive piece of software, and because of this, consistency was one of the most important must-haves. This approach made it possible for me to speed up the process by allowing me to simply sketch out ideas, discuss them with key stakeholders, rapidly ideate, and present new chunks of functionalities as prototypes that were ready to be tested. Instead of the typical "wireframes to UI to prototype" workflow, I was able to adopt this approach because it allowed me to speed up the process. It was used not only for the future of the app (without my further involvement), but also as a go-to site for developers working on the project. I constructed a vast library of Figma's components and documentation on Notion over the course of a year and three updates.

Explore Siid Design System →

Siid-DS
siid-end-2
13 months later

What exactly was accomplished.

After thirteen months, a minimum viable product (MVP), and two releases, I have left the project. Siid was introduced to the market with great success, and customers began using the app on day one. I have also set aside around one year's worth of work for future development to be completed and made available at a later date. Siid is going to work hard to assist both small and medium-sized eCommerce businesses in achieving their goals now that they have a solid foundation and an extensive design system in place. Without having to be very concerned about coordinating and managing the supplies. With the rates that were hitherto solely accessible to the industry's most prominent players.

Siid-end

Explore more case studies.

Shipped is better than great.
Why not both, though?

Back to top Arrow
View