Building A Social Search Engine For Places
So(Social) Lo(Local) Mo(Mobile). After the year 2010, there were many So-Lo-Mo produts available out in the market. Even though I didn’t understand the value to share my whereabouts are back then, one product stood out in my view.
After talking to the founders, I became the comapny’s designer and later became an investor. This is the story of how I designed the Spotsetter app that handles 5 million user profiles, 40 million venues, and 1 million curated venue content items from 30 review sites from around the world
THE BACK STORY
Our core product was to provide socially relevant personalized venue results to our users. This means we needed user’s social content and we decided to use Facebook, Instagram, Foursquare, and Twitter. This data collection provided us with photos, likes, comments, and tags. We considered these as private data.
We also came up with a way to collect more data by scraping through more than 30 review sites, curated and aggregated them to get reviewes by both visitors and highly respectable critics for over more than a million venues. We considered these as public data.
MY ROLE
I was the only designer in the six person startup where I mostly worked with my supervisor, who was the VP of product. I did all the design explorations, user research & testings, prototypes, and final deliveries.
THE CHALLENGES
For an early stage startup, everything was a challenge. But the three main challenges I faced were how to:
1. Make the UI/UX of the app to be unique in the age of SoLoMo
2. Prioritize the private and public data we collected and present them to the users in the right order
3. Turn less valuable private and public data to something that will be more engaging to users
Design Solution
UNIQUE SEARCH EXPERIENCE
To me, seeing just a text field over a map, or the fact that I have to type something inside a search field and getting results were just not fitting in with the lifestyle of the demographic I was seeing in the heart of urban San Francisco. I was also inspired by products like Google Now which was always one step ahead of its user.
Personalized Home
Depending on user’s location, the background of the home page changes with quick search icons that are relevant to the location
Search suggestions
User’s recent searches are shown as colorful icons below the search field to quickly get the nearby results
Results
Our very own Spotsetter logo pin was also used to show the results on the map which helped us with brand identity
Split view
Our split view was one of a kind in the industry. Highly praised & loved by our users for its unique data presentation
VENUE DETAIL VIEW
I designed around 8 different versions in the 4 month period and did 3 rounds of user testing to finalize this view. This was mostly due to the fact that different types of venue data were available and needed to communicate in the right manner to the user to make sure the right decision making indicators were presented to the users in the clearest way. You will notice that if done in the right way, less means more.
Private Data
The number of times your friends have been to take the smallest real estates, yet it became the best decision maker for our users to select where they want to go
Valuable Public Data
Frequently used terms we got from Foursquare API also became the strongest indicator for users to make the decision
In-depth Public Review
Either it’s the critics’ review or general public reviews from crowd sourced sites, we got you covered
Final Step
We became the first product to say openning soon, and closing soon on venues
GIVING POWER BACK TO THE USERS
Since day one our founders’ vision was to provide a personalized local search experience and the best way to provide that is to give users a say in their own search result. The team’s plan was to create a product where our users can tag their friends with expertise. Since we already had their friends' data, we analyzed it and suggested back to our users with expertise we thought are relevant.
Tagging Friends with Expertise
For new users, it starts with a JIT tutorial to tag friends they trust
Suggestion View
The suggestion card shows the number of times this friend has been tagged, and places visited
Visited Places
This view shows why we think these places are highly rated places and thus why we suggested this friend
Flash Recommendations
Right after tagging friends, users will see suggestions for the categories they tagged their friends
The Results After 3 Months
A few months after the launch, we were already having 15000 weekly active users with 6% organic growth. But the most alarming number was that only 42% of the users who downloaded our app would only use the app on the second open of the app. After we looked more deeply into this number, we started to realized that our users never really returned when their data is ready. When their data is ready you asked?
KNOWN ISSUE
As I have said before, the app needed users’ social data to provide the personalized social data back. For this we allowed our users to login with their facebook account and start collecting
1. the user’s geo tagged data
2. geo tagged data where the user is also tagged
3. friends’ geo tagged data, and
4. geto tagged data where friends have been tagged. That is a lot of data and it took around 4-5 days to finish all the data for one user.
We realized that it would be a problem and the way we decided to solve that problem after doing a lot of user testings is by
1. getting user’s last one month data for immediately after sign up since we want local data only
2. prioritize who lives close to the user so that we get only local results again.
This turned 4-5 days of data mining into 1 hour of data mining. For us it was a significant achievement and we belived that waiting one hour to use the data is not a big deal for our users. We were dead wrong.
Design Solution
This really hurt me personally since I started to feel like it was my mistake. I was the UX designer and I completely failed the team by not recognizing the obvious human behavior. Maybe because I was working really hard on the Detail View and Split Result View so much, I started to feel like my app is gonna change the way people behave but in fact, it was just another app for users. I started to dive down really hard into the usage patterns inside our app and started doing research on other apps outside of our So-Lo-Mo world.
The first thing I noticed was inside the expertise tagging process, we put in 8 empty slots at the bottom of the screen and we disabled the next arrow which is on the top right. When the user tags the friend, the profile photo of that friend fill up one of the empty slots. The next arrow is then enabled.
The catch here is the user are not required to tag 8 friends to go to next step. But most of our users started to tag 8 friends to fill up all the empty slots.
This shows that if the UI looks like an instruction needed to be followed, our users will act what they think is needed to take them to the next step. Tool tip that provides more information also encourages them to tag their friends with different expertises.
short info + progress ui = success!!!
So I started a FTUE flow where I put big and bold text to the what is happening and what we would need from the user. A button to continue to the next step is also always on the same position. As the user moves forward, the progress indicator at the bottom would also move forward to indicate the steps the user needs to make. I tried to time the flow by putting Get Local Results button right before showing system location permission button to give better context to the user.
It was the same for Facebook Login button and Notification Me button too. I tried explaining to the user that personalization would take time and asking for notification permission was the key in this whole flow. Showing a timer countdown also helped the users to understand the wait is getting shorter by the second. While waiting, the user could also connect more networks to get better results. When the user came back after the wait, I showed a welcome screen with friends’ photos rotating in the background. It was to show that starting from this screen everything will be personalized.
The Results
We made this change in last then one week and updated it. In two weeks, we started to see that 78% of app downloads become first time users, a jump from 43%. And 82% of users open notifications for venue recommendations, a jump from 55%. It was a great win for us and we were able to show our users the true value of Spotsetter app by letting them come back to our app, tag their friends, search for results, and see the data on venue detail view.
Conclusion
Since Spotsetter’s news started to spread across Silicon Valley, we started to get offers from different companies and on June 2014, we were acquired by Apple for our technology. It was a huge win for us, our investors, and our customers since our product will now live inside Apple Maps.
A year after the acquisition, iOS was updated and I started to see something familiar from my design not just inside Apple Maps but also on iOS search. It was our signature quick search colorful icons.
For confidentiality reasons, I have taken out the actual numbers from all the companies I have worked for and have put percentage. These are all just my views on the project I worked on and does not represent the views on the organizations.
© www.yairpike.com 2011-2021