The future of design
is spec-driven.
Mowgli is the first design tool with product understanding. Visualize and concretize your idea in minutes: high-trust, high-quality, and ready for dev.
Built with Mowgli
Project 01
Off Menu
Mobile FirstChef Marketplace
Hyperlocal food delivery connecting you with vetted home chefs. Discover unique, neighborhood-exclusive dishes cooked within 3km of your door.
Welcome
Hero section visible with primary and secondary CTAs, feature highlights, customer testimonials, and footer links.
Phone Number Input
Initial screen with phone number input field and country code selector.
SMS Verification
Screen showing 6-digit verification code input after SMS is sent.
Password Creation
Password and confirm password fields with strength indicator.
Personal Details
Form fields for first name, last name, and email address.
Location Permission
Location permission request dialog with explanation of 3km radius.
Address Input
Address form with autocomplete for delivery location.
Notification Preferences
Toggle switches for push, SMS, and email notifications.
Signup Complete
Success message with automatic redirect to DiscoveryFeed.
All Chefs
Shows all available chefs within 3km radius with no filters applied.
Available Now
Available now" filter is active, showing only chefs currently accepting orders.
Search Active
Search bar is focused with keyboard visible, showing recent searches and suggestions.
Not Following
Chef profile with prominent "Follow" button, showing all chef information and dishes.
Following
Chef profile with "Following" button and notification bell, user receives updates from this chef.
Schedule Expanded
Weekly schedule section is expanded showing detailed time slots for the week.
All Categories
Shows all available dishes from the chef with no category filter applied.
Category Filtered
A specific category (Mains, Sides, Desserts) is selected, filtering the dish list.
Cart Has Items
Floating cart button shows item count badge (e.g., "3") indicating items in cart.
Delivery Selected
Delivery option is selected, showing delivery fee and estimated time.
Pickup Selected
Pickup option is selected, showing available time slots from chef's schedule.
Preparing
Chef is preparing food, status shows "In Progress" with estimated time.
Ready for Delivery
Food is ready, driver is assigned and shown on live map with ETA.
Ready for Pickup
Food is ready for pickup, showing QR code and pickup instructions.
Completed
Order is complete with prompt to rate and review.
Active Orders Tab
Shows active orders with status badges and progress indicators.
Past Orders Tab
Shows completed orders with reorder options and review prompts.
Profile Overview
Shows profile photo, name, followed chefs count, and quick access to all settings.
Managing Addresses
Delivery addresses section is expanded showing list with add/edit/delete options.
Managing Payment Methods
Payment methods section is expanded showing saved cards with add/edit/delete options.
Notification Settings
Notification preferences section is expanded with toggle switches.
Selecting Rating
Star rating selector is active with no stars selected yet.
Writing Comment
Rating selected, text area is focused for writing review comment.
Subscription Overview
Shows current plan, billing date, payment method, and quick actions.
Billing History
Shows table of past payments and invoices.
Update Payment Method
Modal is open with credit card form for updating payment method.
Upgrade Plan Modal
Modal is open showing plan upgrade options with feature comparison.
Viewing Profile
Shows current profile information with no unsaved changes.
Editing Bio
Bio text area is focused with content being edited.
Uploading Photo
Photo upload section is active with preview and crop options.
Selecting Specialties
Cuisine specialties selector is open with tag selection interface.
Earnings Overview
Shows current week earnings, month-to-date totals, and key metrics.
Payout History
Shows detailed table of past payouts with dates and amounts.
Inventory Overview
Shows current inventory levels and monthly subscription status.
Low Inventory Alert
Shows warning for items running low with quick reorder options.
Weekly Calendar
Shows full week with day toggles and time slot editors.
Day Details Expanded
Specific day is expanded showing detailed time slots and capacity settings.
New Orders
Shows pending orders requiring acceptance with Accept/Decline buttons.
Preparing Orders
Shows accepted orders being prepared with "Mark as Ready" buttons.
Ready for Pickup/Delivery
Shows orders marked as ready awaiting pickup or driver assignment.
Completed Orders
Shows fulfilled orders with customer information and ratings.
Cancellation Reason Modal
Modal is open asking for cancellation reason with radio options and text input.
Project 02
Splitto
FintechReal-time
Eliminate shared expense awkwardness with virtual group cards. Automatically split purchases in real-time with no manual math or reimbursements.
Default
Full landing screen displayed with hero section, feature highlights, social proof, and primary/secondary CTAs visible.
Invitation Link Handler
Modal or sheet appears when user taps "I have an invitation", allowing them to paste or enter an invitation code/link.
Step 1: Phone Email
First onboarding step with phone number, email, and password inputs. Progress indicator shows step 1 of 3.
Step 2: Verify Contact
Verification step with code inputs for phone and email. Progress indicator shows step 2 of 3.
Step 3: Link Payment Method
Payment method linking step with Plaid integration. Progress indicator shows step 3 of 3.
Completion Screen
Success screen with celebration animation and "Create Your First Group" CTA.
Default with Groups
Home screen showing grid of group cards with transaction previews, member counts, and status indicators.
Empty State
No groups yet - shows friendly illustration with "Create Your First Group" CTA.
Step 1: Group Type Selection
Selection screen showing cards for Couple, Housemates, Trip, and Custom group types with descriptions.
Step 2: Group Details
Group configuration with name input and split ratio selector showing real-time amount preview.
Success Screen
Celebration screen with virtual card details displayed and options to add to wallet or invite members.
Default View
Full group dashboard with header, balance summary, and transaction feed visible.
Admin View
Same as default but with admin-only quick actions toolbar visible and card details unblurred.
No Transactions
Group created but no transactions yet - shows empty state with illustration.
Search Active
Search bar focused with query entered, showing filtered transaction results.
Filter: Pending Only
Filter toggle set to "Pending", showing only pending transactions.
Filter: Flagged Only
Filter toggle set to "Flagged", showing only flagged transactions requiring admin review.
Default View
Full transaction details with header, split breakdown, and appropriate action buttons based on user role.
Flagged Transaction
Transaction flagged by member - shows red status indicator and admin review notice.
Refunded Transaction
Transaction refunded - shows refund status and credit amounts per member.
Failed Payments
One or more member payments failed - shows error indicators and retry status.
Admin Actions Visible
Admin view showing "Adjust Split" and "Reverse Transaction" buttons.
Default Settings
Card settings screen showing card details, spending limits, and security options.
Card Inactive
Card status toggled off - shows inactive state and warning about declined transactions.
Replace Card Confirmation
Confirmation modal visible asking admin to confirm card replacement.
Default View
Payment methods list showing primary method highlighted and other methods with actions.
Pending Charges Alert
Warning banner visible about pending charges preventing method removal.
Remove Method Confirmation
Confirmation modal for removing payment method with settlement requirements.
Adding Payment Method
Plaid Link flow open for connecting new bank account or card.
No Payment Methods
No payment methods linked - shows prompt to add first method.
Default Settings
Group settings showing info, members list, permissions, and danger zone.
Member Actions Open
Action sheet open for selected member showing options to promote or remove.
Remove Member Confirmation
Confirmation modal showing settlement warning before removing member.
Leave Group Confirmation
Confirmation modal for member leaving group with settlement requirements.
Archive Group Confirmation
Admin confirmation modal to archive group with final settlement warning.
All Groups View
Activity feed showing transactions from all groups with date headers and stats.
No Transactions
No transactions in selected filter - shows empty state with illustration.
Default Account View
Account screen showing profile section, settings list, support options, and app info.
Edit Profile Modal
Modal open for editing profile name and uploading/changing avatar photo.
Notification Preferences
Screen showing detailed toggles for different notification types and delivery methods.
Security Settings
Security screen showing biometric settings and password change options.
Sign Out Confirmation
Confirmation modal asking user to confirm sign out action.
Step 1: Reason Selection
First step showing radio button list of flag reasons with optional text input for "Other".
Step 2: Confirmation
Confirmation step showing selected reason summary and warning about pausing charges.
Retroactive Application
Retroactive toggle enabled with date range selector and impact summary visible.
Impact Details Expanded
Detailed breakdown of credits/debits for retroactive changes shown.
Project 03
Soon
Video StreamingSocial
Speed dating reimagined: minimal profiles and immediate 5-minute video dates. Authenticity first—match, meet via video, then decide.
Welcome
Welcome screen with hero section, value proposition, and primary "Get Started" CTA visible. No scrolling has occurred.
Step 1: Contact Entry
Phone/email entry screen with verification code input field. Step indicator shows 1/7 progress.
Step 2: Identity
Identity information entry with fields for first name, last name, age, gender, and dating preferences. Step indicator shows 2/7 progress.
Step 3: Profile Setup
Profile creation with photo upload control and one-liner input with live character counter. Step indicator shows 3/7 progress.
Step 4: Personality Traits
Personality configuration with sliders for own traits (Outgoing/Introverted, Adventurous/Homebody, Spontaneous/Planner, Active/Relaxed, Talkative/Listener) and ideal partner preferences on same dimensions. Step indicator shows 4/7 progress.
Step 5: Availability Setup
Weekly availability configuration with day toggles and time slot pickers. Step indicator shows 5/7 progress.
Step 6: Permissions
Permission request screen for camera, microphone, and notifications with explanations. Step indicator shows 6/7 progress.
Step 7: Complete
Profile summary screen with "Start Swiping" action button. Step indicator shows 7/7 progress.
Default View
Profile card prominently displayed with photo, distance, and one-liner. Pass and Like buttons visible at bottom.
Full-Screen Photo
Profile photo expanded to full screen with dismiss control. Distance and one-liner overlaid on photo.
Report Modal Open
Report modal overlay with selection of report reasons and confirmation button.
Match Confirmed
Both profiles displayed side by side with "Speed Date Now" and "Schedule for Later" options. 7-day countdown timer visible.
Unmatch Confirmation
Confirmation dialog overlay asking user to confirm unmatching action.
Mutual Yes - Chat Unlocked
Success animation showing that both users said Yes and chat is now unlocked with option to start chatting.
Active Match
Match with "Active" status showing "Speed Date Now" and "Schedule for Later" options with 7-day expiration countdown.
Scheduled Date
Match with scheduled date showing date/time, countdown to date, and "Reschedule" and "Cancel Date" options.
Awaiting Decision
Match showing "Awaiting Decision" status with 24-hour countdown timer for other user's decision.
Unmatch Confirmation
Confirmation dialog overlay asking user to confirm unmatching action.
Month View
Calendar showing current month with available dates highlighted. No date selected yet.
Date Selected
Date is selected and time slots are displayed below calendar. Available slots are visually distinct.
Default View
List of 7 days with some days enabled showing time slots, others disabled. Save and Cancel buttons visible.
Adding Time Slot
New time slot row being added with start and end time pickers open for selection.
Upcoming Dates
Tab showing list of upcoming video dates with countdown timers and reschedule/cancel options.
Past Dates
Tab showing list of past video dates with outcome status and options to view profile or start chat.
Cancel Confirmation
Confirmation dialog asking user to confirm cancellation of scheduled date.
Active Matches
Active tab showing matches needing scheduling with expiration countdowns, sorted by soonest expiration.
Scheduled Matches
Scheduled tab showing upcoming video dates with date/time information.
Awaiting Decision
Awaiting Decision tab showing completed dates where user is waiting for other's decision.
Connecting
Call is initializing with "Connecting..." status, showing own camera preview and waiting for other user to join.
In Call
Active video call with both users visible, 5-minute countdown running, and all call controls available.
Extend Time Prompt
At 4:30 mark, overlay appears asking both users if they want to extend by 2 minutes with countdown timer.
Report Modal
Report overlay with selection of reasons (inappropriate content, harassment, technical issues, other).
Request Received
Modal displayed with caller's profile, name, one-liner, and 60-second countdown. Join and Decline buttons available.
Request Received
Modal displayed with caller's profile, name, one-liner, and 60-second countdown. Join and Decline buttons available.
Decision Pending
Screen showing other user's profile with "Want to keep talking?" question and Yes/No options. 24-hour countdown visible.
Empty Chat
New conversation with empty message thread and icebreaker suggestions to help start the conversation.
Active Conversation
Message thread with multiple messages exchanged between both users, input field ready for new message.
Block/Unmatch Confirmation
Confirmation dialog asking user to confirm blocking or unmatching the other user.
View Profile
Current profile displayed with photo, one-liner, and read-only age/gender/preferences. Save and Cancel buttons visible.
Editing One-Liner
One-liner field is being edited with live character counter showing remaining characters.
Changing Photo
Photo selection interface open with options to take new photo or select from gallery.
Editing Traits
User is actively dragging a slider, with visual feedback showing the current value.
Let's deep dive
A streamlined workflow designed to take you from back-of-napkin sketch to production-ready specifications and designs.
Step 01
Brainstorm & Scope
Start by explaining your initial idea. Work through a dynamic questionnaire to refine your vision. Mowgli will translate this to your unique specification.
Q1:Let's start with the basics. What kind of application are we building today?
Please choose one option
Mobile App
Web Dashboard
Landing Page
E-commerce Store
Q2:Got it. And who is the primary user you want to optimize for?
Please choose one option
Power Users
First-time Visitors
Enterprise Admins
Q3:Love the trust-focused angle. That makes me think about group dynamics—should everyone have equal control?
answeredPlease choose one option
Full democracy: anyone can change splits
Admin model: one person manages settings
Flexible rules based on the group type
Other...
+ Add note or additional context
Q4:How should we handle the 'settle up' experience? Smooth and invisible, or celebratory?
Please choose one option
Invisible / Auto-charge
Manual & Celebratory
Monthly Digest
Q5:What type of methods of payments would you like to integrate with?
Please choose one option
Bank details
Apple Pay
Direct debit
Q1:Let's start with the basics. What kind of application are we building today?
Please choose one option
Mobile App
Web Dashboard
Landing Page
E-commerce Store
Q2:Got it. And who is the primary user you want to optimize for?
Please choose one option
Power Users
First-time Visitors
Enterprise Admins
Q3:Love the trust-focused angle. That makes me think about group dynamics—should everyone have equal control?
answeredPlease choose one option
Full democracy: anyone can change splits
Admin model: one person manages settings
Flexible rules based on the group type
Other...
+ Add note or additional context
Q4:How should we handle the 'settle up' experience? Smooth and invisible, or celebratory?
Please choose one option
Invisible / Auto-charge
Manual & Celebratory
Monthly Digest
Q5:What type of methods of payments would you like to integrate with?
Please choose one option
Bank details
Apple Pay
Direct debit
Step 02
The Spec View
Get a god-mode view of your application. Iterate on the spec directly to refine requirements before pixel-pushing.
Spec
Elevator Pitch
User Journeys
Data Model
Frontend
Backend Integrations
SpecUser Journeys
1. New User Onboarding
1.1. App Discovery and Account Creation
- 1.1.1.User downloads Splitto from App Store or Google Play Store
- 1.1.2.User opens app and sees a welcome screen explaining core value...
- 1.1.3.User taps "Get Started" button
- 1.1.4.User enters personal information: full name, email address, phone number
- 1.1.5.User creates a secure password
Step 03
Generate Designs
Pick a theme or steer the style. Mowgli will generate high-fidelity designs for every screen and state. Not just happy paths - explore all nooks and crannies of your product.
localhost:3000/dashboard
Step 04
Iterate & Polish
Meet your infinite canvas. Use natural language to request changes that ripple through your project. Whether a visual or functional change - spec and designs update in sync.
Screens
Sign up
Overview
Add Group
Group Details
Settings
Payment Methods
Disputes
Step 05
Export
Ready to build? Get a curated master prompt to continue in your AI-powered builder, export into Figma or download a .zip with your spec and React code and get hands-on yourself.
Export Project
Continue with AI coded assistance
Get the optimized master prompt with your full PRD spec and all screens, ready to attach in your favourite AI-native builder to launch in production.
Figma
Great for further design work or sharing. Export all of your screens and states to a Figma file using the Mowgli Figma plugin.
Mowgli package
Perfect for a developer or AI. Download a .zip package containing your specification, and React + Tailwind code for your screen designs.
The new bottleneck? You.
Join our beta waitlist and start building comprehensive products with Mowgli today.