screensdesign
LibraryCreateMCPPricingLoginRemoved appsApp Store ScreensWeb Onboardings

Mobile place search flow examples

Search the library

Vrbo Vacation Rentals: Discovering Destinations

Open recorded flow

  1. Step 1 · 4:54

    Vrbo Vacation Rentals: Top header with title and dates, followed by a horizontal property carousel, then a 'Travel guides' section with a large banner and smaller category cards, and a bottom navigation bar.See the flow
    Vrbo Vacation Rentals

    Top header with title and dates, followed by a horizontal property carousel, then a 'Travel guides' section with a large banner and smaller category cards, and a bottom navigation bar.

  2. Step 2 · 4:58

    Vrbo Vacation Rentals: Top navigation bar, search summary header, filter bar, loyalty banner, vertical list of property cards, and a floating map button at the bottom.See the flow
    Vrbo Vacation Rentals

    Top navigation bar, search summary header, filter bar, loyalty banner, vertical list of property cards, and a floating map button at the bottom.

  3. Step 3 · 5:12

    Vrbo Vacation Rentals: Top navigation, followed by a 2x3 grid of interest cards, a horizontal region filter bar, and a vertical list of destination cards.See the flow
    Vrbo Vacation Rentals

    Top navigation, followed by a 2x3 grid of interest cards, a horizontal region filter bar, and a vertical list of destination cards.

  4. Step 4 · 5:17

    Vrbo Vacation Rentals: Hero image at the top, followed by a title and tags, then a vertical list of destination cards.See the flow
    Vrbo Vacation Rentals

    Hero image at the top, followed by a title and tags, then a vertical list of destination cards.

  5. Step 5 · 5:18

    Vrbo Vacation Rentals: Top image carousel, followed by text content, an info card, and a horizontal list of property cards at the bottom.See the flow
    Vrbo Vacation Rentals

    Top image carousel, followed by text content, an info card, and a horizontal list of property cards at the bottom.

  6. Step 6 · 5:35

    Vrbo Vacation Rentals: Map at the top, followed by trip title and tab navigation, then a list of saved property cards, and a footer section for exploring more.See the flow
    Vrbo Vacation Rentals

    Map at the top, followed by trip title and tab navigation, then a list of saved property cards, and a footer section for exploring more.

  7. Step 7 · 5:40

    Vrbo Vacation Rentals: Top navigation bar, followed by a header, a horizontal tab filter, a horizontal scrolling carousel of attraction cards, and a text section at the bottom.See the flow
    Vrbo Vacation Rentals

    Top navigation bar, followed by a header, a horizontal tab filter, a horizontal scrolling carousel of attraction cards, and a text section at the bottom.

  8. Step 8 · 5:49

    Vrbo Vacation Rentals: Top image carousel, followed by text content, tags, and a bottom information card.See the flow
    Vrbo Vacation Rentals

    Top image carousel, followed by text content, tags, and a bottom information card.

  9. Step 9 · 6:04

    Vrbo Vacation Rentals: Top navigation, followed by a grid of interest categories, a horizontal filter bar for regions, and a vertical list of destination cards.See the flow
    Vrbo Vacation Rentals

    Top navigation, followed by a grid of interest categories, a horizontal filter bar for regions, and a vertical list of destination cards.

Yelp: Food, Services & Reviews: Searching & Filtering for Restaurants

Open recorded flow

  1. Step 1 · 0:31

    Yelp: Food, Services & Reviews: Header with search bar, category chips, vertical feed of business cards, and bottom navigation.See the flow
    Yelp: Food, Services & Reviews

    Header with search bar, category chips, vertical feed of business cards, and bottom navigation.

  2. Step 2 · 0:44

    Yelp: Food, Services & Reviews: Top search bar followed by a list of suggestions, with the system keyboard occupying the bottom half of the screen.See the flow
    Yelp: Food, Services & Reviews

    Top search bar followed by a list of suggestions, with the system keyboard occupying the bottom half of the screen.

  3. Step 3 · 0:52

    Yelp: Food, Services & Reviews: Top search bar, map view in the middle, horizontal filter bar, and a list of business cards at the bottom.See the flow
    Yelp: Food, Services & Reviews

    Top search bar, map view in the middle, horizontal filter bar, and a list of business cards at the bottom.

  4. Step 4 · 1:07

    Yelp: Food, Services & Reviews: Top navigation bar followed by price filters, popular toggles, a floating calendar modal, a sort list, and a bottom action button.See the flow
    Yelp: Food, Services & Reviews

    Top navigation bar followed by price filters, popular toggles, a floating calendar modal, a sort list, and a bottom action button.

  5. Step 5 · 1:14

    Yelp: Food, Services & Reviews: Top navigation bar, followed by Price section, Popular filters section, Sort options list, and a fixed bottom action button.See the flow
    Yelp: Food, Services & Reviews

    Top navigation bar, followed by Price section, Popular filters section, Sort options list, and a fixed bottom action button.

  6. Step 6 · 1:33

    Yelp: Food, Services & Reviews: Top navigation bar, followed by scrollable sections for 'Offering' and 'Meal', ending with a fixed bottom action button.See the flow
    Yelp: Food, Services & Reviews

    Top navigation bar, followed by scrollable sections for 'Offering' and 'Meal', ending with a fixed bottom action button.

  7. Step 7 · 1:40

    Yelp: Food, Services & Reviews: Top navigation bar followed by vertical list sections for filter categories, ending with a full-width bottom action button.See the flow
    Yelp: Food, Services & Reviews

    Top navigation bar followed by vertical list sections for filter categories, ending with a full-width bottom action button.

  8. Step 8 · 1:46

    Yelp: Food, Services & Reviews: Header with navigation, followed by scrollable sections for Distance and Payment, ending with a fixed bottom action button.See the flow
    Yelp: Food, Services & Reviews

    Header with navigation, followed by scrollable sections for Distance and Payment, ending with a fixed bottom action button.

  9. Step 9 · 1:52

    Yelp: Food, Services & Reviews: Top search bar, map background, filter chip row with tooltip, empty state message in center, bottom navigation bar.See the flow
    Yelp: Food, Services & Reviews

    Top search bar, map background, filter chip row with tooltip, empty state message in center, bottom navigation bar.

Klook: Travel & Activities: Searching for an Activity

Open recorded flow

  1. Step 1 · 1:21

    Klook: Travel & Activities: Top header with image and text, followed by a central search card with three input fields, and a bottom primary action button.See the flow
    Klook: Travel & Activities

    Top header with image and text, followed by a central search card with three input fields, and a bottom primary action button.

  2. Step 2 · 1:24

    Klook: Travel & Activities: Top search bar followed by a section header and a grid of destination chips.See the flow
    Klook: Travel & Activities

    Top search bar followed by a section header and a grid of destination chips.

  3. Step 3 · 1:36

    Klook: Travel & Activities: Modal overlay with a header title, a scrollable calendar grid, and a fixed bottom action bar.See the flow
    Klook: Travel & Activities

    Modal overlay with a header title, a scrollable calendar grid, and a fixed bottom action bar.

  4. Step 4 · 1:53

    Klook: Travel & Activities: Header with close button and title, followed by two categorized sections of selectable pill buttons, and a bottom footer with clear and confirm actions.See the flow
    Klook: Travel & Activities

    Header with close button and title, followed by two categorized sections of selectable pill buttons, and a bottom footer with clear and confirm actions.

  5. Step 5 · 1:56

    Klook: Travel & Activities: Top hero image with text, followed by a white card containing three input fields, and a bottom primary action button.See the flow
    Klook: Travel & Activities

    Top hero image with text, followed by a white card containing three input fields, and a bottom primary action button.

  6. Step 6 · 2:01

    Klook: Travel & Activities: Top search bar, date/filter pills, results count/sort, followed by a vertical list of activity cards.See the flow
    Klook: Travel & Activities

    Top search bar, date/filter pills, results count/sort, followed by a vertical list of activity cards.

  7. Step 7 · 2:08

    Klook: Travel & Activities: Header with close button and title, followed by vertical sections for categories, price range, and location, ending with a bottom action bar.See the flow
    Klook: Travel & Activities

    Header with close button and title, followed by vertical sections for categories, price range, and location, ending with a bottom action bar.

  8. Step 8 · 2:28

    Klook: Travel & Activities: Top navigation bar with search and filters, followed by a results count and a list of activity cards, with a bottom sheet modal overlaying the lower half of the screen.See the flow
    Klook: Travel & Activities

    Top navigation bar with search and filters, followed by a results count and a list of activity cards, with a bottom sheet modal overlaying the lower half of the screen.

Found an example you like?See the whole story.

See the full library See plans