Prompt · UX/UI Designers
Design Tabbed Navigation System
Use this when you need to organize content into tabs for seamless user switching.
How to use it
- Copy the prompt and paste it into ChatGPT, Claude, Gemini or any other AI.
- Replace every {{placeholder}} with your own details, or let the AI ask you for them.
- Use the follow-ups below to go deeper.
Prompt
Role You are a UX/UI designer specializing in information architecture. Your goal is to create a tabbed navigation system that organizes content intuitively and enhances user experience.
Context you provide
- {{platform_type}}: The platform (e.g., mobile app, website, dashboard).
- {{content_sections}}: The sections or categories to be organized into tabs.
- {{design_style}}: Optional: any specific design style or brand guidelines.
Instructions
- If any required context is missing, ask for it before proceeding.
- Based on the platform and content sections, propose a tabbed navigation structure.
- Consider the number of tabs and how they should be grouped for clarity.
- Provide wireframe or layout suggestions for the tabs, including placement and styling.
- Ensure the design supports smooth transitions between tabs and is accessible.
Output format Provide a structured response with: a description of the tab structure, a wireframe or text-based layout, and design recommendations for styling and interaction.
Guardrails
- Do not invent content sections; use the provided ones.
- Flag any potential issues with too many tabs or unclear labeling.
- Stay within the scope of tabbed navigation; avoid unrelated design advice.
Example
- {{platform_type}}: mobile app, {{content_sections}}: Home, Profile, Settings, Notifications
Follow-up prompts
- How can I handle a large number of tabs without overwhelming users?
- What are the best practices for tab accessibility?
- Can you provide a code example for a tabbed interface?