Oasis (Web/App)

Duration: 13 Weeks

Roles: UX/UI Designer and Researcher

Tools: Adobe Creative Cloud and Figma

Oasis is a media streaming app that provides tools for both amateur and professional music creators to broadcast their creative processes. Over the course of 13 weeks I and 3 other IU Luddy students brainstormed, researched, prototyped, and presented an app designed to solve:

“How can we make music
creation and consumption
easily accessible for everyone?”

Screen Shot 2023-02-21 at 5.08.06 PM.png

Brainstorming

Screen Shot 2023-02-21 at 5.21.30 PM.png

Style Guide

To keep our design uniform our team created a set list of colors and font that are consistent in our app/website:

Target Audience Identification

Initially our team created a singular mobile version, however as our team iterated we quickly realized there was simply too much information to be in one place. After realizing this, our team divided the application into two versions: App and Web. The app being dedicated to the listeners/watchers(consumers). While the web version is meant to support creation.

App

Sam: Amateur

Student at IU Bloomington
likes to watch media in free time
Artistically inclined, is a connoisseur of music.
Very extroverted and sociable

Website

Francisco: Professional

A 9-5 worker who likes to create music in their free-time
Constantly busy, can't afford studio time.
Artistically inclined, life-long Musician
Expert in music theory
Very Extroverted, and wants to share music

I now know the

(Tools)

(Person)

I'm researching for

Research

Secondary Research

Screen Shot 2023-02-21 at 5.33.54 PM.png

Screen Shot 2023-02-21 at 5.53.20 PM.png

Primary Research

Screen Shot 2023-02-21 at 7.28.03 PM.png

Screen Shot 2023-02-21 at 7.36.58 PM.png

From our interviews in our primary research we received many comments about making the accessibility features similar to fellow streaming apps like Soundcloud and Spotify. With this feed-back, we prioritized making each page as simplistic as we could.

Affinity Diagram

Screen Shot 2023-02-22 at 7.55.52 AM.png

Screen Shot 2023-02-22 at 5.22.30 PM.png

After completing all of our research, our team combined all of our finding onto a Miro board. To organize our data our team used affinity diagrams and arrows to draw relationships behind each interview or finding.

With new knowledge, our team began

(Developing)

Prototyping

Sketches

Sketching allowed for our team to test and validate the accessibility features in Oasis. This step taught us that the listener and creator couldn’t exist within the same space without overwhelming the user with options. To fix this our team proposed creating a website and app

Iterations

1 of 2 Iterations

These initial iterations appeal to both user personas. The applications are designed so the listener/watcher and the creator have minimal clicks to the homescreen.

Screen Shot 2023-02-28 at 2.25.18 PM.png

Screen Shot 2023-02-28 at 2.31.49 PM.png

Screen Shot 2023-02-27 at 7.46.11 PM.png

2 of 2 Iterations

In our consult and critique we were told there were problems with approachability, and that the design was overall hard to follow. We incorporated our feedback by adding detail, more screens, and overall better flow to the application. At this stage there were no iterations on the web version.

Screen Shot 2023-03-01 at 4.42.56 PM.png

Screen Shot 2023-03-01 at 4.47.37 PM.png

Screen Shot 2023-03-01 at 4.50.04 PM.png

Before we began prototyping in figma, our team iterated our initial designs. Because of this we were able to bring our developed idea and sketches to the low-fidelity stage.