Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Algolia - Mobile Search Patterns

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

Lucas CERDAN

March 08, 2017
Tweet

More Decks by Lucas CERDAN

Other Decks in Technology

Transcript

  1. Improving your Mobile Search Experience March - 2017 Lucas Cerdan

    Product Manager [email protected] @lucascerdan Alex Kudelka Director, Business Development [email protected] @alexkudelka
  2. Anatomy of Mobile Search > Search today & Why Algolia?

    > Anatomy of Mobile Search > Elements of a great Mobile Search > Q&A Wrap up Agenda
  3. 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...
  4. 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
  5. Search Today & Why Algolia? 3 Steps to Build Algolia

    Mobile Search Patterns Alex & Lucas
  6. 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
  7. 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
  8. 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
  9. Anatomy of Mobile Search > Search Screen > Auto Suggest

    or Instant Result > Results Screen Search: multiple screens
  10. Anatomy of Mobile Search Make Search Easily Discoverable Mobile Search

    Patterns Alex & Lucas Full length Dedicated tab Simple Icon
  11. 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
  12. 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
  13. 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
  14. Anatomy of Mobile Search Leveraging Geosearch Mobile Search Patterns Alex

    & Lucas ➔ Geosearch is a powerful use case on mobile. ➔ Consider helpful view options
  15. Elements of great Mobile Search > Design: Real estate is

    key > Usability: Respect User's Effort > Environment: Speed and Connectivity Mobile specific issues
  16. Elements of great Mobile Search > Design: Real estate is

    key > Usability: Respect User's Effort > Environment: Speed and Connectivity Mobile specific issues
  17. Design: Real estate is key User Interface Mobile Search Patterns

    Alex & Lucas Visually-driven vs Spec driven
  18. 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.
  19. Elements of great Mobile Search > Design: Real estate is

    key > Usability: Respect User's Effort > Environment: Speed and Connectivity Mobile specific issues
  20. Usability: Respect User's Effort Define clear hit areas Mobile Search

    Patterns Alex & Lucas Mobile has a Fat Finger issue
  21. 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
  22. 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
  23. Elements of great Mobile Search > Design: Real estate is

    key > Usability: Respect User's Effort > Environment: Speed and Connectivity Mobile specific issues
  24. 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
  25. Environment: Speed and Connectivity Manage Users Expectations Mobile Search Patterns

    Alex & Lucas → Progress indicators → Lazy Loading → Skeleton Screens
  26. 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
  27. Made for developers Building blocks for all platforms Mobile Search

    Patterns Alex & Lucas → SDK (iOS, Android) for native apps → JS Frameworks for mobile web