Wave

Shaping Core Workflows for Mobile-First Storytelling

Shipped

Shipped

Shipped

Designing the first content creation workflows from the ground up to make sharing travel stories simple, engaging, and accessible.

Note: Per a non-disclosure agreement signed by both parties, the name of the client was changed. Elements of the work produced for this project have been modified or omitted in their entirety.

Industries

Social Media
Travel

Tools

Figma
Monday
Google Docs

Focus Areas

  • Strategy

  • Mobile Product Design

  • Accessibility

  • Information Architecture

Team

  • Head of Product

  • iOS and Android Developers

  • Product Designer (me)

Tools

Sketch
Paper sketching

Industries

Healthcare
Employment

Work

  • Strategy

  • Mobile Design

  • Web Design

  • Accessibility

  • Information Architecture

Team

  • Founder

  • Developer

  • Caregiver Specialists

  • UX Design Contractor (me)

Project Status

Shipped 2018

First Flow

Designed the first content creation flow from spec to live product

First Flow

Designed the first content creation flow from spec to live product

0 → 1

Defined mobile-first patterns that shaped future features

0 → 1

Defined mobile-first patterns that shaped future features

First Flow

Designed the first content creation flow from spec to live product

0 → 1

Defined mobile-first patterns that shaped future features

Overview

Laying the Groundwork for Storytelling at Scale

Wave was a mobile-first social network for sharing inclusive travel experiences. When I joined as product designer, the first priority was to design the content creation flow from the ground up. This required translating product requirements into clear, intuitive interactions that would make story sharing simple for travelers and accessible to all users.


Building this first flow wasn’t just about shipping a feature — it set the tone for how future features would be designed, tested, and delivered. The patterns established here became the foundation for Wave’s design direction as the platform expanded.

Overview

Laying the Groundwork for Storytelling at Scale

Wave was a mobile-first social network for sharing inclusive travel experiences. When I joined as product designer, the first priority was to design the content creation flow from the ground up. This required translating product requirements into clear, intuitive interactions that would make story sharing simple for travelers and accessible to all users.


Building this first flow wasn’t just about shipping a feature — it set the tone for how future features would be designed, tested, and delivered. The patterns established here became the foundation for Wave’s design direction as the platform expanded.

Context and Opportunity

Setting the Stage for Multi-Platform Storytelling

As a brand-new platform, Wave’s promise rested on giving users an engaging way to share and discover inclusive travel stories. To deliver on that, we needed more than just a working feature — we needed a first workflow that set the tone for everything that would follow.


The opportunity was twofold:


  • For users: Deliver a content creation flow that felt approachable, intuitive, and rewarding from day one.


  • For the team: Establish design and interaction patterns that could scale across new features and platforms, reducing rework and keeping engineering aligned.


What began on iOS soon expanded to Android and later the web app. By treating this first flow as more than a one-off, we positioned Wave not only to launch smoothly, but to define a foundation for future growth across platforms.

As a brand-new platform, Wave’s promise rested on giving users an engaging way to share and discover inclusive travel stories. To deliver on that, we needed more than just a working feature — we needed a first workflow that set the tone for everything that would follow.


The opportunity was twofold:


  • For users: Deliver a content creation flow that felt approachable, intuitive, and rewarding from day one.


  • For the team: Establish design and interaction patterns that could scale across new features and platforms, reducing rework and keeping engineering aligned.


What began on iOS soon expanded to Android and later the web app. By treating this first flow as more than a one-off, we positioned Wave not only to launch smoothly, but to define a foundation for future growth across platforms.

As a brand-new platform, Wave’s promise rested on giving users an engaging way to share and discover inclusive travel stories. To deliver on that, we needed more than just a working feature — we needed a first workflow that set the tone for everything that would follow.


The opportunity was twofold:


  • For users: Deliver a content creation flow that felt approachable, intuitive, and rewarding from day one.


  • For the team: Establish design and interaction patterns that could scale across new features and platforms, reducing rework and keeping engineering aligned.


What began on iOS soon expanded to Android and later the web app. By treating this first flow as more than a one-off, we positioned Wave not only to launch smoothly, but to define a foundation for future growth across platforms.

The Challenge

Designing Without a Net

Wave’s first content creation workflow had to do more than just work on iOS. It also needed to set a foundation for Android and the web app that would follow. That meant designing for clarity, speed, and flexibility, all while working without an established design system or prior patterns to lean on.


As the sole product designer, every interaction, layout, and control had to be defined from scratch, while working in lockstep with engineering to keep progress moving.


Key challenges included:


  • No existing patterns: Every interaction, layout, and control had to be designed from scratch.


  • Mobile-first but multi-platform: The iOS flow needed to translate seamlessly to Android and, later, to the web app.


  • Avoiding rework: Without shared standards, there was risk of inconsistencies and duplicated effort as features rolled out.


  • Tight collaboration with engineering: Aligning on feasible solutions was critical with multiple platforms in parallel development.

Wave’s first content creation workflow had to do more than just work on iOS. It also needed to set a foundation for Android and the web app that would follow. That meant designing for clarity, speed, and flexibility, all while working without an established design system or prior patterns to lean on.


As the sole product designer, every interaction, layout, and control had to be defined from scratch, while working in lockstep with engineering to keep progress moving.


Key challenges included:


  • No existing patterns: Every interaction, layout, and control had to be designed from scratch.


  • Mobile-first but multi-platform: The iOS flow needed to translate seamlessly to Android and, later, to the web app.


  • Avoiding rework: Without shared standards, there was risk of inconsistencies and duplicated effort as features rolled out.


  • Tight collaboration with engineering: Aligning on feasible solutions was critical with multiple platforms in parallel development.

Wave’s first content creation workflow had to do more than just work on iOS. It also needed to set a foundation for Android and the web app that would follow. That meant designing for clarity, speed, and flexibility, all while working without an established design system or prior patterns to lean on.


As the sole product designer, every interaction, layout, and control had to be defined from scratch, while working in lockstep with engineering to keep progress moving.


Key challenges included:


  • No existing patterns: Every interaction, layout, and control had to be designed from scratch.


  • Mobile-first but multi-platform: The iOS flow needed to translate seamlessly to Android and, later, to the web app.


  • Avoiding rework: Without shared standards, there was risk of inconsistencies and duplicated effort as features rolled out.


  • Tight collaboration with engineering: Aligning on feasible solutions was critical with multiple platforms in parallel development.

Problem Statement

The first content creation flow needed to balance clarity and scalability across iOS, Android, and web without established patterns or a design system.

Problem Statement

The first content creation flow needed to balance clarity and scalability across iOS, Android, and web without established patterns or a design system.

Problem Statement

The first content creation flow needed to balance clarity and scalability across iOS, Android, and web without established patterns or a design system.

Process and Approach

Building Clarity from the Ground Up

With no prior patterns to draw from, I worked closely with the Head of Product and engineers to translate product requirements into an intuitive, mobile-first experience that could scale across platforms.


How I approached it:

With no prior patterns to draw from, I worked closely with the Head of Product and engineers to translate product requirements into an intuitive, mobile-first experience that could scale across platforms.


How I approached it:

With no prior patterns to draw from, I worked closely with the Head of Product and engineers to translate product requirements into an intuitive, mobile-first experience that could scale across platforms.


How I approached it:

01_Grounded in Requirements
01_Research and Insights: Identifying the Gaps

Translated product requirement documents into early sketches, clarifying flows and edge cases before moving into Figma.

Translated product requirement documents into early sketches, clarifying flows and edge cases before moving into Figma.

Translated product requirement documents into early sketches, clarifying flows and edge cases before moving into Figma.

02_Iterative Prototyping

Built low- to mid-fidelity prototypes to evaluate assumptions with internal stakeholders, tightening feedback loops with engineering.

03_Mobile-First Principles

Designed interactions specifically for iOS first (gestures, tap targets, and navigation) while planning ahead for Android and web translation.

04_Iterative Rollout

Established button styles, layouts, and navigation structures that not only served the initial flow but also provided a foundation for future features.

The process balanced speed and scalability: delivering a fully functional workflow on time while ensuring it could expand into the larger ecosystem Wave was rapidly building.

The process balanced speed and scalability: delivering a fully functional workflow on time while ensuring it could expand into the larger ecosystem Wave was rapidly building.

The process balanced speed and scalability: delivering a fully functional workflow on time while ensuring it could expand into the larger ecosystem Wave was rapidly building.

Solution

From Blank Screen to Storytelling Flow

Designing Wave’s first workflow meant balancing simplicity with the expressive potential of a social storytelling platform. The solution centered on creating a content creation flow that felt approachable to first-time users while laying groundwork for richer features down the line.


Key elements of the solution included:


  • Guided entry point: A clear starting state introduced users to the flow with minimal cognitive load, reducing hesitation to create.


  • Step-by-step structure: Content inputs were broken into logical stages, helping users focus on one decision at a time without feeling overwhelmed.


  • Mobile-first layouts: Touch-friendly interactions, large tap targets, and streamlined visual hierarchy ensured the flow worked seamlessly on iOS — while creating a foundation adaptable to Android and web.


  • Reusable interaction patterns: Even without a formal design system, consistent navigation, input styles, and confirmation states were applied, planting the seeds for standards that would later grow into Wave’s design system.


The result was not just a single feature, but the beginning of a product language: an approachable, repeatable way of designing flows that could scale as Wave expanded to new devices and new audiences.

Designing Wave’s first workflow meant balancing simplicity with the expressive potential of a social storytelling platform. The solution centered on creating a content creation flow that felt approachable to first-time users while laying groundwork for richer features down the line.


Key elements of the solution included:


  • Guided entry point: A clear starting state introduced users to the flow with minimal cognitive load, reducing hesitation to create.


  • Step-by-step structure: Content inputs were broken into logical stages, helping users focus on one decision at a time without feeling overwhelmed.


  • Mobile-first layouts: Touch-friendly interactions, large tap targets, and streamlined visual hierarchy ensured the flow worked seamlessly on iOS — while creating a foundation adaptable to Android and web.


  • Reusable interaction patterns: Even without a formal design system, consistent navigation, input styles, and confirmation states were applied, planting the seeds for standards that would later grow into Wave’s design system.


The result was not just a single feature, but the beginning of a product language: an approachable, repeatable way of designing flows that could scale as Wave expanded to new devices and new audiences.

Designing Wave’s first workflow meant balancing simplicity with the expressive potential of a social storytelling platform. The solution centered on creating a content creation flow that felt approachable to first-time users while laying groundwork for richer features down the line.


Key elements of the solution included:


  • Guided entry point: A clear starting state introduced users to the flow with minimal cognitive load, reducing hesitation to create.


  • Step-by-step structure: Content inputs were broken into logical stages, helping users focus on one decision at a time without feeling overwhelmed.


  • Mobile-first layouts: Touch-friendly interactions, large tap targets, and streamlined visual hierarchy ensured the flow worked seamlessly on iOS — while creating a foundation adaptable to Android and web.


  • Reusable interaction patterns: Even without a formal design system, consistent navigation, input styles, and confirmation states were applied, planting the seeds for standards that would later grow into Wave’s design system.


The result was not just a single feature, but the beginning of a product language: an approachable, repeatable way of designing flows that could scale as Wave expanded to new devices and new audiences.

Results and Impact

Faster Delivery, Stronger Collaboration

The launch of Wave’s first content creation workflow gave the platform more than just a functional entry point — it set the rhythm for everything that followed.


  • For users, the new flow made it simple and rewarding to share travel stories, helping establish early credibility for Wave as a storytelling platform.


  • For the team, it created a foundation of mobile-first patterns that scaled to Android and later the web app, reducing redundancy and aligning engineering and design from the start.


By treating this first flow as both a feature and a framework, we delivered a launch-ready experience that not only worked seamlessly on iOS but also provided the building blocks for a consistent, multi-platform product.

The launch of Wave’s first content creation workflow gave the platform more than just a functional entry point — it set the rhythm for everything that followed.


  • For users, the new flow made it simple and rewarding to share travel stories, helping establish early credibility for Wave as a storytelling platform.


  • For the team, it created a foundation of mobile-first patterns that scaled to Android and later the web app, reducing redundancy and aligning engineering and design from the start.


By treating this first flow as both a feature and a framework, we delivered a launch-ready experience that not only worked seamlessly on iOS but also provided the building blocks for a consistent, multi-platform product.

The launch of Wave’s first content creation workflow gave the platform more than just a functional entry point — it set the rhythm for everything that followed.


  • For users, the new flow made it simple and rewarding to share travel stories, helping establish early credibility for Wave as a storytelling platform.


  • For the team, it created a foundation of mobile-first patterns that scaled to Android and later the web app, reducing redundancy and aligning engineering and design from the start.


By treating this first flow as both a feature and a framework, we delivered a launch-ready experience that not only worked seamlessly on iOS but also provided the building blocks for a consistent, multi-platform product.

Lessons Learned

Key Takeaways

Build patterns early

Even before a formal design system, establishing consistent interactions helped avoid fragmentation.

Build patterns early

Even before a formal design system, establishing consistent interactions helped avoid fragmentation.

Build patterns early

Even before a formal design system, establishing consistent interactions helped avoid fragmentation.

Design for scale from day one

Starting with iOS but anticipating Android and web meant workflows could expand without heavy rework.

Design for scale from day one

Starting with iOS but anticipating Android and web meant workflows could expand without heavy rework.

Design for scale from day one

Starting with iOS but anticipating Android and web meant workflows could expand without heavy rework.

Keep the user lens sharp

Focusing on clarity and delight in the first workflow helped prove the product’s promise and drive adoption.

Keep the user lens sharp

Focusing on clarity and delight in the first workflow helped prove the product’s promise and drive adoption.

Keep the user lens sharp

Focusing on clarity and delight in the first workflow helped prove the product’s promise and drive adoption.

From flow to system

Creating the first workflow revealed the inefficiencies of working without shared standards, directly paving the way for the Wave Design System.

From flow to system

Creating the first workflow revealed the inefficiencies of working without shared standards, directly paving the way for the Wave Design System.

From flow to system

Creating the first workflow revealed the inefficiencies of working without shared standards, directly paving the way for the Wave Design System.

Helping mission-driven orgs design and maintain scalable products.

Copyright © 2025 Jose Arias. All rights reserved.

Helping mission-driven orgs design and maintain scalable products.

Copyright © 2025 Jose Arias. All rights reserved.

Helping mission-driven orgs design and maintain scalable products.

Copyright © 2025 Jose Arias. All rights reserved.