Algolia - Mobile Search Patterns

Slides used for our introduction to Mobile Search.
Unfortunately, Speaker Deck does not handle GIF, so we recommend looking directly at those slides on Google Drive: https://docs.google.com/presentation/d/1K1GlRZte_KJVbZakXM1Hjx_hXh-c4mxJZaRfhS7x6DA/edit?usp=sharing

Transcript

1. Improving your Mobile Search Experience March - 2017 Lucas Cerdan Product Manager lucas.cerdan@algolia.com @lucascerdan Alex Kudelka Director, Business Development alex.kudelka@algolia.com @alexkudelka
2. Todays Agenda Mobile Search Patterns Alex & Lucas
3. Anatomy of Mobile Search > Search today & Why Algolia? > Anatomy of Mobile Search > Elements of a great Mobile Search > Q&A Wrap up Agenda
4. Search Today & Why Algolia? Building Search Today Mobile Search Patterns Alex & Lucas Building the right search experience until now required a lot of back-end skills, making it inaccessible to the majority of developers and taking massive time investment. Scalability Typo tolerance Hosting Multi-Language support Faceting Scoring formula Availability Concatenation of words Access Rights management Sharding Real-time Indexing Synonyms Analytics Etc...
5. Search Today & Why Algolia? What is Algolia Mobile Search Patterns Alex & Lucas Great Search UX for end-users Ease of Integration on any device Strong Infrastructure all around the world Hosted Search API with a core focus on... Relevance Speed Usability Desktop Mobile 99.999% SLA 15+ regions
6. Search Today & Why Algolia? 3 Steps to Build Algolia Mobile Search Patterns Alex & Lucas
7. Search Today & Why Algolia? Trusted by Leaders Mobile Search Patterns Alex & Lucas Real-time Indexing 250 Million objects 10k queries / seconds 10ms per keystroke Media
8. Search Today & Why Algolia? Trusted by Leaders Mobile Search Patterns Social Network 10 million users 25 languages Burst usage 350 years of video a day Alex & Lucas
9. Search Today & Why Algolia? Trusted by Leaders 30B+ API Calls per month 2500+ customers in 100+ countries “After integrating Algolia, we increased our conversion rate on search by 10%. We had replaced our main search in only a few weeks of work.” - Vincent Paulin, Data Manager – alittleMarket (Esty company) “From the initial phone call to Aftership being completely live and running on Algolia, it took less than two weeks with only one engineer working on the project.” - Teddy Chan, CEO – Aftership
10. Anatomy of Mobile Search Mobile Search Patterns Alex & Lucas
11. Anatomy of Mobile Search > Search Screen > Auto Suggest or Instant Result > Results Screen Search: multiple screens
12. Anatomy of Mobile Search Make Search Easily Discoverable Mobile Search Patterns Alex & Lucas Full length Dedicated tab Simple Icon
13. Anatomy of Mobile Search Multiple Fields Search Mobile Search Patterns Alex & Lucas Good implementation ➔ Show only one search box at first ➔ Use good default values for other fields
14. Anatomy of Mobile Search Tapping on the Search already shows an intent. ➔ Previous Search ➔ Popular/Trending Suggestions ➔ Category Browsing ➔ Add a Hint in the Search box Search Screen
15. Anatomy of Mobile Search Auto Suggest Mobile Search Patterns Alex & Lucas
16. Anatomy of Mobile Search Instant Results Mobile Search Patterns Alex & Lucas
17. Anatomy of Mobile Search Combining both Mobile Search Patterns Alex & Lucas
18. Usual components: ➔ A Back or Cancel button ➔ A Search box with the active query ➔ The most important filters: scope, price, … ➔ Filter & Sort button(s) ➔ Results Anatomy of Mobile Search Results Screen
19. Anatomy of Mobile Search Leveraging Geosearch Mobile Search Patterns Alex & Lucas ➔ Geosearch is a powerful use case on mobile. ➔ Consider helpful view options
20. Elements of great Mobile Search Mobile Search Patterns Alex & Lucas
21. Elements of great Mobile Search > Design: Real estate is key > Usability: Respect User's Effort > Environment: Speed and Connectivity Mobile specific issues
22. Elements of great Mobile Search > Design: Real estate is key > Usability: Respect User's Effort > Environment: Speed and Connectivity Mobile specific issues
23. Design: Real estate is key User Interface Mobile Search Patterns Alex & Lucas Visually-driven vs Spec driven
24. Design: Real estate is key Relevance Mobile Search Patterns Alex & Lucas Relevance is the key to search. Without it, all best practices are for nothing. → Both textual and business ranking rules are required, → Algolia search engine comes with built-in relevancy and all the tools to make your search relevant.
25. Elements of great Mobile Search > Design: Real estate is key > Usability: Respect User's Effort > Environment: Speed and Connectivity Mobile specific issues
26. Usability: Respect User's Effort Define clear hit areas Mobile Search Patterns Alex & Lucas Mobile has a Fat Finger issue
27. Usability: Respect User's Effort Typo tolerance Mobile Search Patterns Alex & Lucas Typing on a (mobile) keyboard is hard. → Reduce frustration by solving your users’ mistakes / misspellings
28. Highlighting + Great to understand where a query matched in a result Usability: Respect User's Effort Scanning Information Inverted Highlighting + Great to understand how query suggestions are different
29. Elements of great Mobile Search > Design: Real estate is key > Usability: Respect User's Effort > Environment: Speed and Connectivity Mobile specific issues
30. Environment: Speed and Connectivity ⚡ Speed matters Mobile Search Patterns Alex & Lucas → Speed is key for engagement, retention and rewarding user experience → Instant Search: Algolia average response time (including network) is < 100ms
31. Environment: Speed and Connectivity Manage Users Expectations Mobile Search Patterns Alex & Lucas → Progress indicators → Lazy Loading → Skeleton Screens
32. Environment: Speed and Connectivity Algolia Offline Mobile Search Patterns Alex & Lucas → Search, even without any network → Choose what you need to sync in the user device → Seamless online and offline experience
33. Made for developers Mobile Search Patterns Alex & Lucas
34. Made for developers Building blocks for all platforms Mobile Search Patterns Alex & Lucas → SDK (iOS, Android) for native apps → JS Frameworks for mobile web
35. Thank you! Q&A Time Lucas Cerdan Product Manager lucas.cerdan@algolia.com @lucascerdan Alex Kudelka Director, Business Development alex.kudelka@algolia.com @alexkudelka