Mission Statement generator modal design for Goal Manager App

🎯 Mission Statement Builder | Goal Manager App by Arootah

Helping users align their goals with deeper purpose — this modal is a guided, step-by-step mission statement builder integrated directly into the Goal Manager app. Each goal set within areas like Family, Contribution, Leisure, and more can now have its own personalized mission statement, reinforcing user motivation and clarity.

🧠 UX Highlights:

• Clean, structured flow with 6 intuitive steps: Roles, Values, Principles, Code of Conduct, Purpose, and Vision — all clearly tracked via a vertical progress indicator. • Contextual inputs supported by an AI Assistant, which generates and suggests personalized text with a smart “Top Pick” badge for relevance. • Smart defaults + editable suggestions = less cognitive load, more user clarity. • Seamless writing experience: users can mix their own input with AI-generated content at any stage.

💡 UI Decisions:

• Left sidebar with timeline-style progress reinforces momentum and transparency. • Right-side panel balances suggestions and actions cleanly, keeping primary input space distraction-free. • Responsive modal layout using Figma’s auto layout and collapsible sidebars adapts gracefully to desktop and mobile experiences. • Clear visual hierarchy, soft neutral tones, and strong readability for a calm and focused writing experience.

This screen is part of a broader effort to make goal setting not just tactical — but also deeply meaningful. Built with intention, scalability, and empathy.

🔍 What do you think about using AI to co-write purpose statements? 👇 I’d love your feedback!