← INDEX

CASE 04 · FULL-STACK · UI · DASHBOARD

Tasstify

A full-stack recipe platform with a real admin room behind it.

YEAR
2024
ROLE
Product design, full-stack development
STACK
React · Node.js · REST API · Admin dashboard
Tasstify, exploded technical cover plate
CASE 04 · EXPLODED VIEW
00

BRIEF

Recipes are read in the worst conditions

A recipe app is used with wet hands, a hot pan, and a phone at arm's length. Tasstify's brief: structured recipes that are effortless to follow mid-cook, backed by an admin dashboard so the catalog stays alive after launch.

  • N-01The kitchen, not the couch, set the reading requirements.
01

STRUCTURE

A recipe is a data model first

Everything hangs on the content model: ingredients with quantities, steps as discrete actions, timings, servings, tags. Getting that schema right made search, scaling portions, and the admin side straightforward instead of painful.

FIG 01-A · ADMIN, RECIPE TABLE
FIG 01-B · COOK MODE, ONE STEP AT A TIME
  • N-02Steps stored as atoms so the interface can pace them one at a time.
02

SYSTEM

Two interfaces, one system

The public side is warm and legible: recipe cards, generous type, photography-first layouts. The admin side is dense and fast: tables, filters, statuses. Both are built from one component system so the product feels whole.

FLOUR#FFF8F2COCOA#221A14PAPRIKA#E8632BHERB#3E7C4FAaWARM SANS PUBLIC + DENSE MONO ADMINSTEP 4 · FOLD, DON'T STIRPRIMARYGHOST
FIG 02 · TWO-DENSITY SYSTEM
  • N-03Same tokens, two densities: public reads calm, admin reads fast.
03

CRAFT

Cook mode is the signature

The craft went into the cooking flow: steps presented one at a time in large type, ingredient amounts always in reach, progress you can find again after putting the phone down. Small touches, like keeping the screen awake mid-recipe, do the quiet work.

FIG 03 · CATEGORY BROWSE
FIG 03 · CATEGORY BROWSE
  • N-04One-step-at-a-time pacing beat the scrolling wall of text in every test.
04

BUILD

API, database, auth, and the admin room

Full-stack build: a REST API over a relational schema, authentication and roles, and an admin dashboard with full recipe CRUD, user management, and activity overview. The dashboard is a real product, not an afterthought bolted onto the database.

  • N-05Admin actions are audited: every change to the catalog is attributable.
05

SHIPPED

Served on both sides of the counter

Tasstify ships as a complete platform: cooks follow recipes comfortably, and the team behind it manages everything from one room.

FIG 05-A · HOME, LIVE
FIG 05-A · HOME, LIVE
FIG 05-B · FAVOURITE RECIPES
FIG 05-B · FAVOURITE RECIPES
  • N-06The assembled dashboard above mirrors the real admin layout.

A recipe product that works on both sides of the counter: cooks get a reading experience built for messy hands and small screens, and admins get a dashboard that makes the catalog manageable.

REACT · NODE.JS · REST API · ADMIN DASHBOARD
TASSTIFY · PROCESS
000%

GALLERY

Tasstify, up close

FIG 01-A · ADMIN, RECIPE TABLE
FIG 01-B · COOK MODE, ONE STEP AT A TIME
FLOUR#FFF8F2COCOA#221A14PAPRIKA#E8632BHERB#3E7C4FAaWARM SANS PUBLIC + DENSE MONO ADMINSTEP 4 · FOLD, DON'T STIRPRIMARYGHOST
FIG 02 · TWO-DENSITY SYSTEM

NEXT · CASE 05

Auto Check