# Ux Navigation

> >

- **Type:** Skill
- **Install:** `agentstack add skill-parhamb-design-skills-navigation`
- **Verified:** Yes — security-reviewed for prompt injection and unsafe behavior
- **Seller:** [parhamb](https://agentstack.voostack.com/s/parhamb)
- **Installs:** 0
- **Category:** [Agent Skills](https://agentstack.voostack.com/c/agent-skills)
- **Latest version:** 0.1.0
- **License:** MIT
- **Upstream author:** [parhamb](https://github.com/parhamb)
- **Source:** https://github.com/parhamb/design-skills/tree/main/navigation
- **Website:** https://design-skills-pi.vercel.app

## Install

```sh
agentstack add skill-parhamb-design-skills-navigation
```

Requires the [AgentStack CLI](https://agentstack.voostack.com/docs/cli). Works with Claude Code, Cursor, and any MCP-compatible agent.

## About

# Navigation UX

Navigation is the skeleton of the app. When it is invisible and predictable,
users feel in control. When it is broken or confusing, they leave.

---

## Checklist

| Item | Guidance |
|---|---|
| Home accessible anywhere | Logo or home tab always returns to the root screen from anywhere in the app. |
| Persistent navigation | Tab bar or bottom navigation is visible on all primary screens. |
| Max 3 taps to content | Any piece of content is reachable in 3 taps or fewer from the home screen. |
| Current location indicator | The active tab is highlighted. Deep screens show a breadcrumb or clear title. |
| Android back button | Follows the back stack correctly. Never exits the app unexpectedly. |
| Back button on every screen | Every pushed screen has a back or close button in the top-left corner. |
| Logical flow | Navigation order matches the user's mental model and task sequence. |
| Deep link support | Every major screen has a URI scheme or Universal Link for direct access. |
| Tab bar badge counts | Unread count badges are accurate and clear when the content is viewed. |
| Scroll padding | Content at the bottom is padded above the tab bar height and safe area. |
| Status bar visible | Status bar is shown during normal app use. Hidden only in full-screen media. |

---

## Navigation Patterns

**Bottom tab bar (iOS)**: 3 to 5 items maximum. Icon and label together.
Badge for notification counts. Not used for destructive actions.

**Side drawer (Android)**: Suitable for apps with 5 or more top-level sections.
Opened by a hamburger icon or a left-edge swipe. User avatar and name at the top.

**Top navigation bar**: Single screen title centered or left-aligned.
Action icons on the right, maximum 2 visible. Back or close on the left.

**Modal vs push**: Push (drill-down) is for content that is part of the
hierarchy. Modal (sheet or dialog) is for tasks that interrupt the main flow
such as creating, editing, or confirming something. Never push where you
should modal — it breaks the expected back stack behavior.

**Deep linking strategy**: Every major content screen should have a stable URL
or URI scheme. This enables sharing, notifications, and marketing links to
land users directly in the right place without going through the home screen.

## Source & license

This open-source skill is cataloged on AgentStack and links to its original source — we do not rehost the code.

- **Author:** [parhamb](https://github.com/parhamb)
- **Source:** [parhamb/design-skills](https://github.com/parhamb/design-skills)
- **License:** MIT
- **Homepage:** https://design-skills-pi.vercel.app

Install and usage instructions live in the source repository linked above.

## Pricing

- **Free** — Free

## Security capabilities

Automated source analysis of v0.1.0 — what this tool can access:

- **Network access:** no
- **Filesystem access:** no
- **Shell / process execution:** no
- **Environment & secrets:** no
- **Dynamic code execution:** no

*"Yes" means the capability is present in the source — more access means more to trust, not that it is unsafe.*


## Versions

- **0.1.0** — security scan: passed — Imported from the upstream source.

## Links

- Listing page: https://agentstack.voostack.com/l/skill-parhamb-design-skills-navigation
- Seller: https://agentstack.voostack.com/s/parhamb
- Browse the marketplace: https://agentstack.voostack.com/browse

---
Listed on AgentStack — the marketplace for AI agent skills and MCP servers. Every listing is security-reviewed. Creators keep 70%.
