Sway

Main Problems

Inefficient Communication:
Group chats lead to clutter and confusion, making it hard to coordinate meetups.

Lack of Discoverability:
Users struggle to find new events and locations nearby.

Overload of Irrelevant Information:
Existing social apps overwhelm users with non-essential content, making it hard to focus on the essentials.

Benchmark analysis

I conducted a benchmark analysis to compare apps with similar functions. Most social media apps, like Instagram and Snapchat, aim to maximize user screen time by promoting FOMO (Fear of Missing Out) through features like stories. This keeps users constantly engaged. In my analysis, I identified key weaknesses in these apps and aimed to avoid them in my design.

User interviews

The survey results showed a strong need for such a product. Users described current apps as cumbersome, with an overload of unnecessary information, causing essential details to get lost and increasing organizational effort. They often felt stuck in their familiar social circles, with no clear or accessible information about new events, locations, or spontaneous gatherings. Information about these activities wasn’t centralized or easy to find, highlighting the gap this product could fill.

Value Proposition
Canvas

Using the Value Proposition Canvas, "Sway" is tailored to meet users' specific needs and expectations. The customer profile was created based on insights gained from interviews. The Map Value Proposition outlines solutions aimed at fulfilling these customer needs, ensuring the product directly addresses their pains and enhances their experience.

Target group

The users of ‘sway’ are 18 - 34 years old, spontaneous and open to getting to know new places and people.

Ideation

The Crazy 8 method helped during brainstorming by quickly capturing initial ideas. It became clear that certain key elements had to be included: an interactive map, a search function with a list view, a simple accept/decline option for events, a save feature, and the ability to share favorites.

Customer
Journey Map

I sketched a Customer Journey for my two personas, outlining the initial contact, interaction, and use of the app, capturing key moments they experience. Constantly referring to the personas has helped to refine the app’s content, structure, and functionality.

User Story Map

The user story map shows possible user actions. The steps that the user takes to use the product are also shown. The user story map is used to present the user's needs in a rough and clear graphic form.

Sitemap

I created the sitemap to provide an overview of the screens and functions on the respective page. The sitemap also shows the links to the screens and individual functions.

first user flows

I scribbled my first user flows so that I could gather and record my ideas quickly and without too much effort.

Low-fidelity prototype
& testing

Based on the scribbles and the user flows, I created an initial low-fidelity prototype. I used this to carry out testing at an early stage of development in order to make adjustments without having already done any major preparatory work, and once the adjustments had been implemented and I was sure that the application worked, I started working on the style guide, which I then used to implement the visual design of the app.

High-fidelity prototype
& testing

The high-fidelity prototype was created using the customised low-fi version and the applied style guide. The testing at high-fi level, taking into account the style guide, resulted in new inputs. Filling in the correct content also revealed further weak points, which were adjusted.

Colours

I opted for a simple colour scheme (black, white, gradations) to give the images their full colour effect and to avoid making the design look restless. Sway's brand colours (purple, gold) are used as interaction colours. In addition, green, blue and red are used as status colours and the many shades of grey were used to create hierarchies in the visual design.

Components and
Variants

To make the work easier, I have created components and variants. These make it possible to make changes quickly and easily, even at an advanced stage of the design process.

Typography

When choosing the font, I opted for a simple, modern and easy-to-read font (Red Hat Display). For the hierarchical structure of the fonts, I not only used different font styles, but also created clear hierarchies through the gradation of the colour.