Designing an AI Food Tracker Search Screen for New UsersDesigning an AI Food Tracker Search Screen for New Users
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
You know exactly what to type into your own search box.
A new user doesn't.
They open it and see a blinking cursor.
Then they have to guess what your app can do.
I designed an empty search screen for an AI food tracker concept here's what I put in it (if you want to steal it).
Example questions at the top, like "High-protein dinner, 600 kcal".
Those 4 words tell a new user more than a blinking cursor does.
Recent searches, but only once there's history.
A new user has none.
A few big buttons for people who'd rather tap than type, like Breakfast and Dinner.
Barcode scan pinned to the bottom, where a thumb can reach it.
Clear your history, log out of your own app & open search.
If you wouldn't know what to type, neither will they.
Post image
Timothy's avatar
This is such a sharp breakdown of empty states. The example question trick is the real insight, "High-protein dinner, 600 kcal" teaches the whole search grammar in one line. And hiding recents until there is history is exactly right, most apps show an empty box and call it done....
Tanaka's avatar
just from from studying different apps
Anayatul's avatar
Nice work
Tanaka's avatar
thank you :)
Rafee 's avatar
Example prompts in an empty state is a great call.
Tanaka's avatar
sure is :)
Back to feed
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started