top of page

SOCIALIGHTS

Collaborate with Android development students and provide the UX/UI for one of their applications. This was my second assignment, completed in General Assembly's ten week immersive course.  

SOCIALIGHTS HOVER.png

CHALLENGES​

UX : 

Beau Pesa


Development :

Sam Ray

  • This was the first time we had ever worked with a developer to create a functional product. 

  • First time collaborating with another UX designer using new tools to create deliverables.

  • Had to learn Android interface system and components for the first time. 

One week

ACTIVITIES

Pen and paper, Illustrator, Sketch, Balsalmiq, 

InVision. 

Competitive analysis, wire framing, prototyping, teamwork, material design development, flow chunking, persona creation, emotional journey creation, mind mapping, high fidelity mock ups, google map styling, sketching, style guideline creation, worked within the android ecosystem. 

NC research.jpg
research purple.png

RESEARCH

COMPETITIVE ANALYSIS

While all of the applications operating in this market mapped events, none told users physical locations of events their friends were going to in real time; this emerged as an opportunity to fill unmet needs.

socialights competitive.jpg
NC ideation.jpg
Ideation purple.png

IDEATION

I decided to begin my ideation process with associative mind mapping, otherwise known as affinity mapping. This helped me brainstorm what kinds of people, places an d things I associated with event attendance. It helped me begin to think about what an event finding user might be concerned with, such as event type, size and cost as just a few high level examples.  

We drew out a basic user flow that took as few steps as possible. Our developer told us that at the time of our collaboration the interface he was working on would be just a map with dots indicating event locations of people in the applications network. 

I wanted to begin thinking about the different types of festival goers and event promoters that might use the application, fortunately Austin is a perfect city to observe such people, given the huge presence of music culture. These three personas are a cross section of some different possible user groups with different types of motivations. 

I developed a hypothetical timeline for Sally's first day of the SXSW music festival. Since our application is ultimately supposed to help people, I tried to imagine what some of her challenges and goals would be throughout the day, drawing on some of my own personal experiences during that time of year in Austin.  

FEATURE BRAINSTORM

With the competitive analysis complete, I took another look and began to research what kinds of features similar applications had and which ones they were missing. Each of the competing applications had features that I thought it would be important to integrate, but none of them had all of them.

NC design.jpg
design purple.png

DELINEATE

EARLY SKETCHES

With a decent idea of what kind of features our users might be looking for and a sense of their motivations, it was time to start drawing. Since this application is supposed to help you find events in real time, I wanted a really streamlined user flow that gets information to people fast. That way they can get on with their business instead of fussing with their phone. 

Since the initial target user group was active socialites, living in Austin, I took an image of downtown Sixth Street at night and pulled colors from it to determine a palette for the application's interface. I feel this process helped capture the unique appearance and energy of the area.  

palette graphic.jpg

GOOGLE MAPS STYLING WIZARD

I asked my developer about altering the look of the map, which used Google Maps default styling and he said it could not be altered initially. A few months later Google rolled out the maps styling wizard; now I can use that tool to create a custom look and hand off the necessary JSON code plus the static map API URL ... awesome. 

NC testing.jpg
validation purple.png

VALIDATE

After putting together the first InVision prototype, I tested it on a few young socialite people to see how they responded to it. Most of them enjoyed the very straightforward interface design and the lack of complexity.

CHECK purple.png
  • Established an MVP that was buildable with our skill sets and timeline 

  • Kept it simple 

Prev.

minus purple.png
  • Wish we had done more market research 

  • Using new software caused some mistakes. 

Next

MIND MAPPING

mind map.jpg

FLOW CHUNKING

EMOTIONAL JOURNEY

Screen Shot 2018-09-07 at 4.17.39 PM.png

PERSONAS

USABILITY TESTING

WHAT WE DID RIGHT​

AREAS TO IMPROVE

THE TEAM

TOOLS

TIMELINE

PROJECT DESCRIPTION 

VISION

PALETTE

Socialights uses both the Google Maps A.P.I. and Facebook's event feed to map events that you and friends are attending or interested in. Then it generates a map in real time to help you find them. 

feature brainstorm.png
bottom of page