large_Crossover Series NFTs.png

medium_Crossover Series NFTs.png

small_Crossover Series NFTs.png

thumbnail_Crossover Series NFTs.png

From Photography to NFT Art: Twisted Digital Landscapes with Nate Hill

From Design System to ‘NFT Design System’: Creating TinyFaces

Neurodiversity and Inclusion: Choosing Kinder Design

medium_652ccf22c8853584bde5553986a4eed0.png

small_652ccf22c8853584bde5553986a4eed0.png

thumbnail_652ccf22c8853584bde5553986a4eed0.png

Web5 is here. Goodbye Web3? TBD.

<p>Published on <a href="https://blog.prototypr.io/wannaknow-76f928a33e69?source=rss----eb297ea1161a---4">| Prototyping: From UX to Front End &mdash; Medium</a> Erika Kehrwald </p>
<h4>Find it all in once place</h4>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*ES2zlyM2241MdVjVO9xurw.png"></p>
<h3>Whatcha Wannaknow?</h3>
<p>There has yet to be an app that could aggregate the data from all of one’s social media profiles to create a live newsfeed or timeline of one person’s activity online. There are apps that exist such as <a href="http://www.aquaint.us/">Aquaint</a> or <a href="https://getsprouter.com/">Sprouter</a> that allow users to connect all their social media profiles within their app in order to make it easier to follow others on all platforms at one time.</p>
<p>What I am proposing could be built off that framework, but serves a radically different purpose. I want to make it easier to know what someone is up to. Whether it’s a crush, a friend, or a professional I admire, I want to know what they’re doing, what they’re thinking about, who they’re hanging out with, and what music they’re listening to without having to check Snapchat, Instagram, Facebook, Spotify and Venmo…</p>
<p>By now you’re probably thinking I’m a crazy stalker. You’re right. I love stalking people, especially Venmo stalking. Though to ease your concerns, I have thought through the privacy and security implications quite seriously. I wanted to conduct informal interviews in order to research how feelings about privacy, surveillance, and online identity might affect design solutions.</p>
<h3>Initial Sketches &amp; Flows</h3>
<p>I originally envisioned this as a mobile app, but after thinking through the flows and features, I decided to start with a web application before considering a mobile solution. The biggest challenge for me initially was layout. I had to decide how I would organize and unify content coming from so many different platforms as well as differentiate between content created and content consumed of the person being stalked. In my early sketches above, you can see I thought about dividing it by activity: listening, watching, liking, posting, etc. and having the social platforms be mixed within those categories, but even categories of activity was visually overwhelming and confusing.</p>
<p>Users wanted a quick summary of what was most important and most recent about the person. Eventually I came up with a solution that allowed everything to fit on one page via horizontal scrolling. It felt a little radical to consume information like this, but I continued to test it in further iterations.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*QDUJn1HP-nWLlgBHBXo_9A.png"></p>
<p>After that, I sketched and refined a user flow including options for different levels of access depending on whether they were logged into their accounts or not.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*blsL6p4NNyKv0LVwjTfyzg.png">Original idea was going to be called BaeWatch, but the idea and flow remained the same</p>
<p>Later, I made some low-fidelity mockups so I could start getting a layout locked down and start talking to people about what features would be most important to them.</p>
<h3>Research</h3>
<p>I started by informally surveying people at my co-working space in Playa Vista. I found 5 people willing to participate, and asked them questions about how they feel about the state of their online identity, concerns about privacy, and past or current motivations for stalking people online.</p>
<p><strong>I used these questions as a guideline for conversation:</strong></p>
<ul>
<li>Do you feel your online identity represents yourself in a way you like?</li>
<li>Is there information or media that exists about you that you would want to hide from a Google search of your name?</li>
<li>Do you think you’re fully aware of the information your followers can find out about you on all social media platforms you’ve accepted them on?</li>
<li>If they are a parent: would you be interested in knowing what is publicly available about you or your child online?</li>
<li>When looking people up or stalking them online, what are your motivations for doing so? For example, a potential or existing love interest, professional, keeping in touch, parental, birthdays…</li>
<li>How difficult is it to find someone you know little information about online? Do you think different platforms could help narrow down your search?</li>
<li>Which platform has been the most useful or revealing in terms of getting information about someone you are looking up?</li>
<li>Before meeting someone new, how likely are you to look them up online before you meet? On a scale of 1–5 (1=not likely, 5=very likely)?</li>
<li>When you look people up online, how important is it to you that you stay anonymous? On a scale of 1–5 (1=not important, 5=very important)?</li>
<li>If you were looking at an overview of one person’s online activity, would you want a chronological arrangement or highlights of the most recent activity?</li>
</ul>
<p>At the end of the interviews, I showed a low-fidelity mockup of what the homepage and settings/profile pages might look like and asked for their feedback on the layout and design. I also inquired about having a static webpage (like the mockup), explaining how it would work with horizontal scrolling versus having a vertical newsfeed that most of us are accustomed to.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*FDgTBaz_YbUbIPjvUQ3W4A.png">Low-fidelity mockups for: Main Feed (left) vs. Settings/Profile (right)</p>
<h4>Informal Interviews: Insights</h4>
<ul>
<li>2 of 5 people interviewed were parents and 100% of them said that they would be interested in knowing what is publicly available about their child online.</li>
<li>3 in 5 people mentioned being “nervous” or “worried” about what employers might think about their online presence.</li>
<li>Only 1 in 5 people said that it was “very easy” (5 on the scale) to look up information about people online.</li>
<li>60% of people said that LinkedIn was the most useful platform (out of all platforms) for their purposes of looking someone up.</li>
<li>80% said they were “very likely” (5 on the scale) to look someone new up online before meeting them.</li>
</ul>
<p><img alt="" src="https://cdn-images-1.medium.com/max/512/1*Et7kt6x-3NxIgZ3xuHGgkA.png"></p>
<h4>Research: Google Surveys</h4>
<p>I was curious about what results a larger sample size might yield, so I made a 10 question Google Survey using the same questions (only without showing the mockup). I interviewed 51 participants in the U.S. between the ages of 18–55. You can see the survey results <a href="https://surveys.google.com/reporting/survey?survey=x46uxmos5q36yoj5va7mhtuqvu"><strong>here</strong></a>.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*8ClvPvMN5iDPXMxrQ3OdQQ.png"></p>
<h4>Insights</h4>
<ul>
<li>Of the people interviewed, 69.2% were parents and the majority of them said that they <strong>would be interested</strong> in knowing what is publicly available about their child online.</li>
<li>Over half of people surveyed said they <strong>do not </strong>think they’re fully<strong> </strong>aware of the information their followers can find out about them on all social media platforms they’ve accepted them on.</li>
<li>71.8% of them said that <strong>searching by platform</strong> could help narrow down their search.</li>
<li>The majority of people said that <strong>Facebook</strong> was the most useful platform for their purposes of looking someone up.</li>
<li>The majority of people said of them said they were “<strong>very likely</strong>” (5 on the scale) to look someone new up online before meeting them.</li>
<li>Surprisingly, the majority (53.1%) of people felt their online identity represented themselves in a way they<strong> liked</strong>.</li>
<li>People’s motivations differed greatly for looking people up online, but the majority reported “<strong>professional</strong>” followed by “keeping in touch” with “parental” and “crush/love interest” third and fourth to those.</li>
</ul>
<h3>Setup Screen &amp; OnBoarding</h3>
<p>I mentioned how neither Sprouter or Aquaint have not solved the annoying on-boarding process of logging into all of your social media platforms separately, the user must enter an email or username/password for each app.</p>
<p>In terms of privacy and authentication it seems that there is currently no way around this, which presented one of the biggest challenges in terms of user experience and on-boarding. I needed a compelling, empathetic, and perhaps even humorous way of getting people to take the time to link their profiles and feel comfortable doing so; all the while knowing that their account and searches would remain private and anonymous.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*QS6CKSIR0WTgZ4GiHw0yAA.png">The user has a choice from screen 3 whether they want to login/sign up by linking their accounts or go ahead and search with public access</p>
<p><strong>Searching from the landing page: Public Access</strong></p>
<p>In terms of on-boarding, I wanted to give the choice between having to create an account/log in versus just going ahead with a public search as a way to lower the barrier to entry. I wanted to get people on the website using it as an enhanced search engine focused on content and recent activity so that users would want to sign in to their accounts and learn to trust that Wannaknow will keep their identity and stalking anonymous while on the website.</p>
<p>As the on-boarding process is time consuming, I tried to add some humor and simplify the UI. When a user signs up for an account or logs in, users are able to see more information than they would get on a public search. This is what the site looks like for a search with public access.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*KPXIzym42q7QiJJYs4lRgw.png"></p>
<p><strong>Setting up an account: Friend Access</strong></p>
<p>When a user creates an account and signs into their accounts on other platforms they are able to see all of that content on Wannaknow as well. This is what the on-boarding process looks like for a first time user creating an account.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*yaKVHprpj2uqwy8MB0CzIQ.png"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*foBnN-7QxEhSvDEMPjmu7w.png"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*8dApo9ByzFPdvpboejzFng.png"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*qzukQ7CR2BqYmby7IDzvNA.png">If they create an account they can link their profiles like this^</p>
<h4>Searching by Platform: Friend &amp; Public Access</h4>
<p>In my research, people reported different motivations for looking someone up online, but nearly all agreed that they used different platforms to better narrow down a search. For example, if someone is searching for a very generic name, let’s say Eric Johnston, it helps to know that this user’s motivation is professional, so selecting LinkedIn as a filter might help narrow their search.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*5S5ZBlmMQZF14OIgKlTc1Q.png"></p>
<h4>Medium-Fidelity User Flow</h4>
<p>Making an updated user flow helped me prototype and test how the different features and interactions would fit together and work in the final video.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*Q2cbh0lFZVTEi_me9Gpb5A.png"></p>
<h4>User Personas: Additional Features &amp; Use Cases</h4>
<p>I created different personas to try to understand the different people I would be designing for. This actually led to new features that the site could have to accommodate the needs and concerns of people different than me.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*IzGDzDm-nmj-y41lhujwWg.png"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*y7_8jYAfeothrqN7YBSffw.png"></p>
<h3>High-fidelity mockups</h3>
<p>I wanted to make the site feel <strong>simple</strong>,<strong> familiar</strong>, and<strong> trustworthy</strong>. To accomplish this I used a white and gray color palette. I felt that with all the social icons being different colors, I didn’t want the interface to get in the way of the content or make it confusing.</p>
<p><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*k9dwiuhSVtkzVSp8vu_urw.png"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*F_XYDP4-fbvD_eV3h2ftFw.png"><img alt="" src="https://cdn-images-1.medium.com/max/1024/1*AScArQGEQCzhZHVhsh1O5A.png"></p>
<h3>Final Concept Video</h3>
<p><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fplayer.vimeo.com%2Fvideo%2F251876894&amp;dntp=1&amp;url=https%3A%2F%2Fvimeo.com%2F251876894&#038;image=https%3A%2F%2Fi.vimeocdn.com%2Fvideo%2F678808238_1280.jpg&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=vimeo" width="1920" height="1080" frameborder="0"><a href="https://medium.com/media/383fb49b04e40b0f36755c623ce4e204/href">https://medium.com/media/383fb49b04e40b0f36755c623ce4e204/href</a></iframe><iframe src="https://cdn.embedly.com/widgets/media.html?src=https%3A%2F%2Fupscri.be%2Ff51076%3Fas_embed%3Dtrue&amp;url=https%3A%2F%2Fupscri.be%2Ff51076%2F&#038;image=https%3A%2F%2Fe.enpose.co%2F%3Fkey%3DdRXnS9Gplk%26w%3D700%26h%3D425%26url%3Dhttps%253A%252F%252Fupscri.be%252Ff51076%252F%253Fenpose&amp;key=a19fcc184b9711e1b4764040d3dc5c07&amp;type=text%2Fhtml&amp;schema=upscri" width="800" height="400" frameborder="0"><a href="https://medium.com/media/b85dfbb5286d8a25cf2e754b9462cf45/href">https://medium.com/media/b85dfbb5286d8a25cf2e754b9462cf45/href</a></iframe><img src="https://medium.com/_/stat?event=post.clientViewed&amp;referrerSource=full_rss&amp;postId=76f928a33e69" width="1" height="1" alt="stat?event=post.clientViewed&amp;referrerSou"></p>
<hr>
<p><a href="https://blog.prototypr.io/wannaknow-76f928a33e69">Wannaknow</a> was originally published in <a href="https://blog.prototypr.io">Prototypr</a> on Medium, where people are continuing the conversation by highlighting and responding to this story.</p>


Wannaknow

Wannaknow

Find it all in once place

Whatcha Wannaknow?

Top Stories