Swaarm

UI/UX design and rapid prototyping for a social well-being app that finds and reconnects veterans with a new purpose.

subcontract
Intermediate
APR-MAY.2019
Swaarm app design and prototyping

The challenge

Veterans have a high-demand skill set that developed from their time in the army.

Swaarm has a mission to reconnect veterans with the local community in such a way that people can benefit from their unique skill sets.

Swaarm was a project from Headstart Lab (HSL). HSL engaged Kocha Studio to help them as a design partner for their project. 

Swaarm Project
Swaarm Project

How do we get started

Preliminarily, the initial wireframe was provided by HSL. At the discovery phase, we worked around existing project materials and various design techniques/exercises to unpack the design strategy.

For this particular project, we used Brand Desk, 20 Seconds Gut Test, How Might We, Mission Statement, Visual Spectrum, Persona and a Journey Map to reframe a problem and define product form and function.

*Initial wireframe by Headstart Lab

Swaarm Wireframe

The design

Swaarm has two sides of users, including 1. Supply (veterans, defence families, first responders, etc.) and 2. Demand (organisations, government agencies, individuals, etc.).

Each side of the user also differs greatly and as such (based-on persona provided by HSL), one might be a tech-savvy person, but the other might not.

Web app design (UX/UI)

Selected screens (not in order)

Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design
Swaarm Web App Design

What people say

Kocha asks the right questions and focuses on solving the right problems for our business and customers

— Elijah Thai, Co-founder at Headstart Lab

Responsive mobile layout

Selected screens (not in order)

Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web
Swaarm Responsive Mobile Web

The collaboration

Swaarm (the client’s project) was a collaborative project between HSL and Kocha Studio. HSL works exclusively with the client at an early stage and is responsible for all web development solutions. 

On the other hand, Kocha Studio works intensively with HSL to develop a design and rapid prototyping to validate an idea before the project moves to the production phase.

However, we often share our design & development process across each studio and regularly build on top of each other’s works/ideas to incrementally improve the project. 

Swaarm Design Workshop — Kocha Studio

The deliverables

Swaarm was designed and prototyped in Figma. We packaged themaster components, web-app prototype, and responsive mobile layout in the same Figma file.

Additionally, there is also a custom graphic that we developed for a project delivered on a separate illustrator (.ai) file too.

Swaarm Figma File — Kocha Studio

What people say

Kocha is no doubt a valuable asset to any digital project!

— Anh Nguyen, Product Strategy at Headstart Lab

Scope of works

Discovery phase

  • Initial research
  • Design strategy
  • Design workshop

Product design

  • User experience
  • Interface design
  • Mobile responsive design

Interaction design

  • Consultations
  • Flow & story
  • Clickable prototyping

Team and credit

Anh Nguyen
Elijah Thai
Kocha Worapon

...

*Brand by the client.

www.swaarm.org

Need some help with your digital product or brand identity?

Next work

Cache Invest

Mobile app design for a unique investment platform that let people diversified portfolios and invests from their saving.