Ian Page-Echols - Seaker - People at Event screen.jpg

Social iOS App UXPin & InVision Prototypes

Making Friends in the Digital Age: Designing a Credible and Reliable Social Activity App

 

Project

Design and prototype a social media app focused on the trust and security of interactions and information. The intent is to avoid dating scams and other situations where someone can falsely represent themselves, as well to vet people and places you want to meet in real-life. An additional goal is to allow sharing of intents and interest levels.

Challenges

  • Are people interested in security as a feature?

  • What do people base their trust of an app or service on?

  • What are the options and possibilities for making an app or service secure and to verify the information that is entered?

  • What mechanisms could provide security for users going to meet people out in the real world?

Role

Our team shared tasks equally, and I spent significant time working on uniformity of design and placement of elements for our prototype. I also created most of the graphics for our design specification document.

Process

Competitive Analysis: Our first task was to run an in-depth analysis of the strengths and weaknesses of the social apps already on the market. We noted attributes such as target markets, apps organization method, security features, unique selling points, limitations, and possible improvements. By considering features across apps, we also identified features that were not represented.

Competitive Analysis

Survey

Survey: We conducted a survey to understand the insights and goals of prospective users of our app and to validate our premise of a desire for more security and trust. We were pleasantly surprised to receive heartfelt confirmation of an interest in security and valuable feedback. Many answers were sentences, not just a few words, and people had opinions.

Interviews: Using feedback from our survey, we conducted interviews to gain context further clarify the important features for our design. This also served as a sanity check to of our assumptions from our previous research, and to gain nuance.

Affinity Diagramming: We wrote survey responses and interview comments onto sticky notes and grouped them in different ways to figure out the major themes. Although all of our respondents were interested in a security focus, they had a variety of suggestions for features, desires, and methods, and we wanted to group these to target our efforts.

Our groupings pointed to multiple areas to consider, including:

Intent: Is the person looking to date, find friends, or find someone to use an extra ticket they have for a show?

Activity Type: Do they go to concerts or sporting events? Coffee shops? Are they looking to try something for the first time, or do they want to find someone skilled in a technology or task to collaborate with?

Trust: Is the information a person is seeing verified or confirmed in some way? Is the person who they say they are?

Security: Is their data protected? Are the events they are attending in safe areas, and are there ways to protect the person physically?

Communication Method: People did not want their personal information going out to a stranger until that person had been vetted somehow, which meant internal communication methods would be a necessary feature.

Affinity Diagramming

Triangulation

Triangulation

Triangulation: Comparing the combined data from our research, we found that most people would like to do more social activities, and all of our respondents wanted more security in existing or upcoming platforms.

Personas: We created personas using the information from our survey and interview data. While I didn’t find our personas to be that useful for this project, we often quoted something an interviewee had said to give credence to a point we were making, or asked questions about what a particular interviewee would have thought about something. On a project with a larger scope, it would be helpful to have common users or tasks to refer to.

Personas

Personas

Moodboards: After creating personas, we moved to mood boards to guide the design direction of the app. We wanted to convey trust and security, while creating a fun and inviting atmosphere for users. Our goal was to create an app design that felt reliable, stable, and trustworthy while allowing users to express themselves and have fun.

Security Moodboard

Security Moodboard

Whiteboarding: We then moved to whiteboarding, where we brainstormed and sketched out initial ideas for app features, screen layouts, and user flows. We used the information gathered from research, personas, and mood boards to inform our decisions. We explored ideas and concepts, and refined them with team feedback. Whiteboarding was essential as it allowed us to quickly iterate on ideas and refine concepts.

User Flows & Information Architecture: Once we had a rough idea of the features we wanted to include, we started working on the information architecture and user flows. We mapped the sections of the app, and how users would navigate to accomplish their goals. We also identified the key user actions and how they would interact with the app. This helped us identify potential roadblocks or issues with the app flow and allowed us to address them early in the design process.

Sketching: With the user flows and information architecture in place, we started sketching out more detailed wireframes of the app. We iterated, refining and adding details as we went along. We focused on creating a clean and intuitive interface that would be easy for users to navigate.

Prototyping: Once we had a solid wireframe, we moved on to creating a prototype. We used a combination of prototyping tools (paper prototyping and then UXPin) to get to a clickable prototype that we could use for user testing. We tested the prototype with users to identify potential issues and gather feedback on the design. We used this feedback to refine the design and make changes to the app flow and designed a high fidelity prototype using InVision.

Whiteboard Brainstorming

Whiteboard Brainstorming

Final Design: After user testing and iteration, we arrived at the final design for our social media app. Clean and intuitive, with a focus on trust, security, and fun. With a seafoam blue-green color scheme conveying security and calm, the app would allow users to easily vet people and places they wanted to meet in real life and would provide secure communication channels for users to get to know each other before meeting in person.

Overall, the design process involved a lot of research, ideation, and iteration. We focused on creating a design that would meet the needs of our target audience and provide them with a fun and secure way to connect with others. By following a user-centered design approach and testing and iterating on our ideas, we were able to create a design that was both effective and engaging.

User Flows

Sketching Features and Interfaces

Sketching Features and Interfaces

Learnings & Future

Where we’re at: Getting on the same page with the rest of the team is key. It’s important to identify the assumptions that each person is working off of. In this case, we had different ideas about the fidelity of the final product, which caused some rework to get everything to a point where everyone was satisfied. This could have been achieved more efficiently if we had been on the same page from the beginning.

Paper Prototyping

Paper Prototyping

Feature Creep: We added too many features to the design. If we were going to create a minimum viable product (MVP), we would likely need to remove features to get to a 1.0 version. An MVP should include the main features and the necessary details to make the product unique, but it can’t have everything from the start.

Use Native iOS Design Guidelines: While it’s easy to create anything with sketches and prototypes, it’s a good idea to go back to the guidelines for the platform being designed for to ensure that the design makes sense to people familiar with that platform.

Diary Study: The information we gathered was useful, but some of it was anecdotal and lacked detail. It would be helpful to have screenshots or videos of the details of apps that make people feel insecure, vulnerable, or cause them to mistrust a design element. This would provide the necessary information to create a more trustworthy and secure design that meets users' needs.

User Profile Credibility: Two details that could be added to user profiles are security verification icons and linked social profiles to verify a user's identity.

User Feed: Possible features to add to the user feed include a way to post or stream images from a user's life, as well as liking and commenting on other people's posts.

Real-Time: A feature could be added that allows users to show what they are currently doing. This could include information such as whether they are at a concert, rock climbing, or learning to polka.

Outcome

The final deliverables for this project included a high fidelity UXPin prototype, a presentation and slide deck on our project and findings, and a comprehensive specifications document that detailed each interactive element of the design and what would happen when acted on, as well as what information would be presented during actions like searches.

Seaker iOS App UXPin Prototype Screenshots

Seaker Presentation

Design Specification Document