Redesigning the space between the stories row and filter chips.
Current: two separate bars (~80px total). Goal: more compact, warmer, combined.
Current (baseline)
+
Add
🏘️
Nabe
👩
Maria
👨
Tony
🧑
Alex
Current
Morning Briefing›
📅What's Happening›
~80px total
All
Safety
Events
Help
🥐
Event · 2h ago · Williamsburg
Cannoli Tasting at Fortunato Brothers this Saturday
Notes
✗ Two bars feel redundant and heavy
✗ ~80px of real estate for navigation only
✗ White card on white bg feels flat
✓ Clear separation of concerns
Option A — Split Row 50/50
+
Add
🏘️
Nabe
👩
Maria
👨
Tony
🧑
Alex
Option A
☀️Morning Briefing›
📅3 events today›
~36px total — saves 44px
All
Safety
Events
Help
🥐
Event · 2h ago · Williamsburg
Cannoli Tasting at Fortunato Brothers this Saturday
Option A
✓ Biggest space savings (44px freed)
✓ Warm gradient unified feel
✓ Both still independently tappable
✓ Evening briefing swap is trivial (🌙)
✗ "3 events today" is less scannable than a list
✗ Labels may truncate on smaller text
Option B — Split + Date Peek
+
Add
🏘️
Nabe
👩
Maria
👨
Tony
🧑
Alex
Option B
☀️Briefing›
Today
Tmrw
Wed
Thu
›
~36px total — saves 44px
All
Safety
Events
Help
🥐
Event · 2h ago · Williamsburg
Cannoli Tasting at Fortunato Brothers this Saturday
Option B
✓ Calendar side is actually useful at-a-glance
✓ Dot indicators show which days have events
✓ Same 36px height as Option A
✗ Day labels very small — borderline readable
✗ More visual complexity in a tiny space
✗ Dots alone are low-info (how many events?)
Option C — Split + Next Event
+
Add
🏘️
Nabe
👩
Maria
👨
Tony
🧑
Alex
Option C
☀️Briefing›
📅2pm · Cannoli Tasting›
~36px total — saves 44px
All
Safety
Events
Help
🥐
Event · 2h ago · Williamsburg
Cannoli Tasting at Fortunato Brothers this Saturday
Option C
✓ Most actionable — shows actual next event
✓ Time + name = real information density
✓ Still 36px, same savings as A/B
✓ Feels alive — different every day
✗ Long event names will truncate aggressively
✗ Right side less stable/predictable than count
Option D — Stacked Ultra-Compact
+
Add
🏘️
Nabe
👩
Maria
👨
Tony
🧑
Alex
Option D
☀️Morning Briefing — 5 updates›
📅Cannoli Tasting 2pm · Open Mic 8pm · +1›
~60px total — saves 20px
All
Safety
Events
Help
🥐
Event · 2h ago · Williamsburg
Cannoli Tasting at Fortunato Brothers this Saturday
Option D
✓ Keeps logical separation (two rows)
✓ Calendar row shows real event data inline
✓ Warm gradient applies to both rows
✗ Smallest space savings (~20px vs ~44px)
✗ Event list in a 28px row gets tight
✗ Still "two bars" feel, just smaller
Option E — Single Unified Bar
+
Add
🏘️
Nabe
👩
Maria
👨
Tony
🧑
Alex
Option E
☀️5 updates·📅3 events today›
~36px total — saves 44px · 1 tap target
All
Safety
Events
Help
🥐
Event · 2h ago · Williamsburg
Cannoli Tasting at Fortunato Brothers this Saturday
Option E
✓ Most compact (same 36px as A/B/C)
✓ Richest gradient feel — most visual warmth
✓ Dead simple — one thing, one tap
✗ One tap = one combined drawer (more to build)
✗ Loses separate entry points for briefing vs calendar
✗ "5 updates" — user must remember what that means
Evening Briefing Support — applies to all options
The briefing side can swap based on time of day: Before noon: ☀️ Morning Briefing |
Noon–5pm: ☀️ Afternoon Check-in |
After 5pm: 🌙 Evening Briefing
This is a single conditional in the component — no extra structure needed. Options A, C, and E handle this most gracefully since the label is short.
Suggested pick: Option C
Option C (Split + Next Event) gives the best information density in the smallest space. The calendar side shows the actual next event with a time — more useful than a count ("3 events") and more stable than a date strip. It also changes throughout the day as events pass, making the bar feel alive. Evening briefing swap is trivial. If truncation is a concern, Option A is the safe fallback.