Asier Martínez — Founder and Product Designer at Topxel.

Kiff — iOS App.

Eat your food always fresh, and don't let anything go to waste.

Kiff is an iOS App that helps you eat your food in its best state possible. By eating fresh food, you waste less, save money, and help the planet. With a unique UI and beautiful details, Kiff is the perfect companion in your journey to achieve zero waste at home.

Roles in this project

Product design, interaction design, web design, content and iOS development.

Most representative screens from Kiff app
Most representative screens.
Kiff initial navigation concept
Initial navigation concept. (Groceries and leftovers "drawers".)
Kiff empty states
Groceries and leftovers drawers. (Empty states.)
Item grid and food detail card
Item grid and food detail card (Concept.)
Groceries and leftovers grid with food examples
Groceries and leftovers grid with food examples.
Kiff's main navigation flow
Kiff's main navigation flow (Add and query.)
Groceries and leftovers main forms
Groceries and leftovers main forms in default state.
Fresh vs expired food view
Fresh vs expired food view. (Expiration date, shelf life, and tracking enabled.)
Start tracking food from a past date
"Log press to start tracking on a past date" feature flow detail.
Emoji suggestion while typing flow
Emoji suggestion while typing flow. (Concept.)
Groceries vs Lefovers emoji selection grid
Groceries vs Lefovers emoji selection grid. (Order detail.)
Emoji suggestion while typing
Emoji suggestion while typing flow. (Final feature.)
Pin feature
Pin to keep an eye on. (Auto pin feature concept.)
Pinned food
Pined food.
Settings
Settings.
Notifications settings
Notification settings. (Time, watch over, self life and expiration date reminders.)
Main navigation flows and architecture
Main navigation flows and architecture.
Supporting views
Supporting views. (Updates, permission requests and feature helpers.)
Notification permission requests and new feature light introduction
Notification permission requests and new feature light introduction.
Stage icons
Stage icons. (From left to right: Develop, Beta and Production.)
Marketing and support website
Marketing and support website.