Splash - Campus Stories
About
Splash Campus Stories is a fun new way to discover video and photos from interesting people on your campus or nearby. Meet new people nearby, and keep in touch with your community.
Splash Campus Stories
Role
I was the Lead Product Designer for this project. I lead the product strategy, created marketing materials, Visual Systems, managed and developed a team of designers, managing project loads, ensuring deadlines, developed the website, and worked closely with the engineering team.
My team members
-
Christian Richman, Growth Manager
-
Abid & Anton, Backend Developer
-
Yuriy & Andrey, Frontend Developer
-
Miguel Paya, Product Designer
-
Baran, Graphic Designer
Tools
-
Sketch, Illustrator, Zeplin, Mixpanel, Gitlab, Xcode, Slack, Fabric, Basecamp, Jira, AWS, Cloudflare, Twilo, Testflight.
Languages
-
Objective-C (on the frontend), Ruby on Rails and MongoDB (backend).
Design Process
This is an example of my design process. Discovering the problem, Define is the research, Ideate is brainstorming the solution, prototyping is building out the product and then testing out the prototype. Then you build, learn and measure in a circle of iteration.
DISCOVER
Problem
77% of college students in the USA use Snapchat. Yet Snapchat doesn't have core features for their community. People are more connected than ever and are always on their mobile phones. Now meeting new people in your community is harder and awkward. We discovered that you need to have the right type of context to speak to new people on your campus or you can come off extremely creepy. Communication skills have dropped since apps like Tinder and Bumble have arrived.
College students live in a dense area and are highly social but don't have a place to keep up with their community and connect. Apps like Tinder allow you to swipe to connect, but you can't get news or much contexts from a still photo. A picture says a thousand words, but watching a video says even more. People are glued to their phones using apps like Snapchat that supply videos of friends (stories) but don't help you connect with new people around you. We are entering an age of social discovery and tapping into your local graph.
People are now glued to their mobile phones more than ever. It's extremely awkward to talk to people around you without context. Why? Fear of missing out is high and fear of rejection.
Define
Research
We researched some location-based apps like Yik Yak, Yeti Campus, Snapchat, Nextdoor, and Instagram to see how they were solving connecting communities. Then we looked at what was missing. Yeti had a big college buzz in the southeast, but it was anonymous and you couldn't connect with the user who posted videos. And a big thing is when summer came and school was over and there was no way for people to share back to their school or nearby. Yik Yak was cool but it was text and trying to trust someone who was anonymous was scary.
Nextdoor was doing a great job connecting communities for older adults, although it didn't seem exciting. Its core features had no video and were more of a neighborhood awareness app. Snapchat had a campus story but it was curated, monitored and for that reason, no one really posted to it. Instagram launched the nearby feature in their discover but it didn't allow you to peek into other colleges as Yeti did. And even worst it was hidden in the discover feed as a secondary feature.
It seemed location and connecting with locals was not a focal point for many social platforms and they lacked the features to make them amazing. Even Snapchat launched a feature called Snap-map but the user interface is creepy and felt more like a stalking feature. This was also a personal issue we all experienced while moving to different cities and going through college.
Competitive Analysis
Location isn't the core-focus for the majority of the current mobile applications. Other apps like Tinder don't give you that much contexts when users are trying to meet new people. And being anonymous doesn't allow you to build trust.
Location isn't the core focus for the majority of the current mobile applications. Other apps like Tinder don't give you that much contexts when users are trying to meet new people. And being anonymous doesn't allow you to build trust.
User Interviews
To build deep empathy with our target users, we decided to observe and ask people from our own social scene and colleges. We interviewed 40 users between the ages of 18-30.
1. What did they like about these popular apps?
2. What didn't they like about these popular apps?
3. Why did they use them?
4. And their age?
5. How did they meet new people currently?
6. How did they hear and start using these popular apps?
7. How did they find out about local events or news?
8. Did they feel comfortable approaching people in their community?
Results
Most people used these apps above so they could meet or connect with their friends or family without leaving their current location. Convenience was the key.
-
The average age was between 18 - 29
-
We found that most people meet through schools or through other dense organizations, apps like Tinder and mutual friends.
-
Very often we notice that the majority of the people we interviewed discovered apps from their friends. Basically word-of-mouth.
-
Most people found out about local events and news from friends, family or while browsing the internet sites. Many people thought it was awkward (fear of being creepy) and weren't comfortable walking up to neighbors without context.
Personas
Deniz
Deniz
Kim
Ying
Chad
Personas from the data we gathered from our social scene and target demographics. This was results a very small local test.
Ideate
Solution
We decided we should answer all of the problems we researched and that were missing from the most popular location-based apps we used. We needed a mobile app that would help local discovery happen. So we thought it should have location-based videos and pictures also called "stories." More of a watching and tapping feature like Snapchat, than a swiping feature like Tinder.
Affinity Diagram
Brainstorming from our feedback and research for product ideas.
Overview of Userflow
Userflow of splash campus focusing on the camera and stories.
Prototype
lo-fidelity
This is low fidelity. Started off with a shark like whale then we decided to go with the whale that was more cartoonish. Baran did the final draft.
High-fidelity
This is low fidelity. I ended up going back over the logo created by Baran discussed on simplifying it more so we removed the gradient. and shadows.
First design concept
I started off with the home screen layout and individual location-based stories. I wanted to keep it simple and have easy to see tabs of location and friends to tap back in forth from. More of a Snapchat style version. This was just to test get more proof of the problem we're solving and the design path.
Medium-Fidelity
This is medium-fidelity prototype that I started creating.
High-Fidelity
This is a medium fidelity prototype that I started creating.
Prototyping Animation
Prototype of the basic idea feature interactions and animation in Home Feed.
Prototype of the basic idea feature interactions and animation in Home Feed.
Interviews
Then we created a couple of promotional shirts, then visited party campuses out east, told them our ideas and got feedback. During our test, we interviewed over 300 college students on the ground. Below is one picture and a few video takeaways.
All Videos
Live interviews at the campus in the southeast. We stayed on campus for 2 weeks and lived like college students. Did parties local events, hanged out the quad, local bars, Etc. We wanted things to feel very natural and get natural feedback off the camera too.
Goals & Challenges
1. Start & Increase growth
2. Create stories with your campus.
3. Connect with students nearby
4. Send private chats to approved friends.
Peek into other colleges.
5. Watch off campus, like for Spring Break, and see what’s happening nearby.
User Testing
We built the first prototype and then we started identifying campus reps to help us test our product demo in real life. First started looking searching through Instagram and posting jobs on college job boards. Then when we found the right matches and interviewed them and trained them.
Iteration 1 & 2
Changed the prototype to increase user posting.
Updates
1. We discovered (through Mixpanel) that we needed to encourage our users to post new stories (videos and photos) to help seed content on the App. Next, it seemed smarter to add "your story" at the top of the screen to help increase the call-to-action to encourage the user to make their first post.
2. Minimized the "segmented controls" to add more space for the "call-to-action" button.
3. Changed the color of the (yellow) camera button to highlight the "camera" button.
Results
1. We did multiple tests and found out that it was harder to get a critical mass with single individual stories on a campus. And the user couldn't really see the difference of the product from Snapchat & Instagram's stories. So then we thought about how we could solve that. We also knew that Yeti Campus had issues with growth when the summer came user could not share back to their campus.
Unfortunately, they didn't have an answer so we had to think of ways to connect locally after school or off-campus. So I came up with a Nearby story that would allow the user to see local stories within 1.5 miles of that user's recent post location. I also allowed them to share back with their own campus if they were off-campus but still wanted to show off what they were doing. Then lastly thought of adding a chat.
Iteration 3
Share screen to send post certain locations or to personal friends chats. And the text on video feature added.
Share screen to send post certain locations or to personal friends chats. And the text on video feature added.
Share screen to send post certain locations or to personal friends chats. And the text on video feature added.
Share screen to send post certain locations or to personal friends chats. And the text on video feature added.
Updates
1. Added "Nearby" Stories to help students see what's happening off-campus and nearby.
2. Developed a "Chat" to help users connect and stay on the platform longer.
3. Created a new "signup-flow" for college emails only. This will allow for more focused college locations.
4. Built "import-contact" feature that had to be approved by each user.
5. Added "text-on-image" feature for user to get creative as they did on similar platforms.
6. Created "splash-points" to encourage users to share, invite friends
7. Invite "friends feature" to increase growth.
8. Updated share screen.
Final Design
On the final design, we tested user loved this one the best and understood it the best visually. It displayed group campus stories allowing users at the same school to share back with their campus and must have a verified school email.
And we displayed the chat on the same home screen to have everything on one screen. I wanted to simplify the design and took away the segmented controls and focused only on connecting through local campus stories.
Final design featuring chat and new stories. A very simple, fun and pleasing product for the college demographics.
Results
Results
-
322 schools signed up in the USA waiting list
-
Captured growth in 4 schools
-
143k user contacts
-
Over 300k shares