Back to Home

UM Studio ¡ Design Concepts

Pick a direction

Interactive prototypes — each with add, delete, swap, multi-meal, and recipe library. Click any to explore it live.

đŸŊī¸
iOS / Mobile-first
Option AClean ¡ Light ¡ Familiar

Day View

Clean white cards, day-by-day scroll, bottom tab bar. Each meal type is a section with colour-coded cards. Bottom sheet for adding. Best for single-handed use and small screens.

Bottom navigation bar
Day selector chips
Colour-coded meal sections
Swipe-style add/delete
Bottom sheet recipe picker
Multi-select confirm flow
Open interactive prototype →
📊
iPad / Sidebar layout
Option BStructured ¡ Spacious ¡ Dashboard

Split View

Permanent left sidebar with weekly mini-calendar and macro donut chart. Right panel shows the selected day in detail. Hover-to-reveal action buttons. Best for iPad landscape.

Persistent sidebar navigation
Weekly mini-calendar
Macro donut ring
Hover-reveal actions
Inline name editing
Centred modal for recipe pick
Open interactive prototype →
📅
Full-week at a glance
Option CDense ¡ Dark ¡ Overview

Week Grid

All 7 days as columns, meal types as rows. Dark theme. Every slot is visible at once — click any empty cell to add, click any card to expand multi-meal, × to delete.

All 7 days visible at once
Dark theme
Expand/collapse multi-meal
Per-day calorie totals
Quick + in every cell
Compact grid cards
Open interactive prototype →
🤝
Meeting Prep Agent UI
Agent PanelContextual ¡ Focused ¡ Clean

Agent Panel Chrome

Three alternatives fixing the heavy teal banner and floating close button. Inline header, right drawer, and pill-chip variants — all shown side-by-side with the original for comparison.

Original reference with issues flagged
Option A: Unified inline header
Option B: Right-side drawer
Option C: Teal accent stripe + pill chip
All 3 fix the floating X problem
Dark theme throughout
Open interactive prototype →
🔊
Meal Plan ¡ iPad-first
Read AloudAudible ¡ Accessible ¡ Kitchen-ready

Read Menu Aloud

Two placements for a speaker button that reads the day's menu aloud (Web Speech API). For kitchen staff on iPad who follow spoken language better than written. Both options shown in idle + speaking states.

Option B: Floating action button (iPad)
Option C: Inline header button (compact)
Language toggle: EN / ā¤šā¤ŋ⤂
Active-meal highlight + pulse
Stop control while speaking
Mobile, laptop, iPad responsive
Open interactive prototype →

Design prototypes only — no production changes.