Workspace & Controls

We designed the interface to stay out of your way so you can focus on building.

The Top Header

• My Maps (Grid Icon): Opens a panel showing all your saved maps. Start a blank map or pick a template from here.
• Title: The name of your current file. Click the text to rename it.
• AI Generate (Sparkle Icon): Type a broad topic to let AI build an entire map from scratch.
• Download (Arrow Icon): Export your map as a high-resolution image (PNG, JPG) or a JSON data file.
• Settings (Gear Icon): Manage your Google Drive connection and paste your Gemini API key.

The Canvas Controls (Bottom Bar)

• Outline View (List Icon): Converts your visual map into a clean text list.
• Presentation Mode (Play Icon): Turns your nodes into a step-by-step slideshow.
• Undo/Redo: The curved arrows let you reverse mistakes easily.
• Zoom Controls: Click the minus/plus icons to zoom. Click the percentage text to instantly "Fit to Screen".

Navigating

To pan around, click and hold any empty space on the grid, then drag your mouse. To zoom, use your mouse scroll wheel, or pinch two fingers on a mobile device or trackpad.

Adding & Editing Nodes

A "node" is the basic building block of your mind map.

Creating New Nodes

Click on any existing node to select it. When selected, the node gets a bright border, and four small circular plus (+) buttons appear on its top, bottom, left, and right sides. Click any of these buttons to instantly spawn a new connected node in that direction.

Editing Text

To change what a node says, simply double-click it. The text will become an editable input box. Type your new idea, and press the Enter key on your keyboard to save. If you are on a touch device, tap the node once, then tap the Pencil icon in the floating toolbar to edit.

Moving & Resizing

• Moving: Click and hold the center of a node, then drag it. The lines connecting it to other nodes will stretch and follow it smoothly.
• Resizing: When you select a node, a tiny circular handle appears in its bottom right corner. Click and drag this handle to manually make the box wider or taller.

Folding Branches (Collapsing)

If your map gets huge, you can hide sections. When a node has children connected to it, a small minus (-) icon appears on the edge between them. Click it to fold and hide that entire branch. The icon turns into a plus (+) so you can expand it later.

Lines & Connections

The lines connecting your nodes are called "Edges". You can customize how they look to match the style of your map.

How to change line styles

Click on the child node (the node at the end of the line). In the floating toolbar above it, click the Edge icon (a line with two dots on the ends). A panel will open with these options:

Colors, Shapes & Text

When you click a node, the floating toolbar appears. This is where you apply themes and formatting.

Colors & Themes

Click the circular color palette icon in the floating toolbar. You can choose from ten different vibrant color themes. Changing a node's color also changes the color of the line connecting to it. The "Glass" option gives the node a frosted, semi-transparent blur effect.

Node Shapes

Click the square icon in the toolbar. You are not restricted to rectangles. You can change the shape to a Pill, Circle, Diamond, Hexagon, Cloud, Slant, Triangle, Star, or Octagon. Note: Some shapes like Diamond or Circle require the node to be a bit larger to fit text properly.

Formatting Text

Click the A icon to open the text panel. Here you can:

• Apply Bold, Italic, or Underline.
• Change the font size by typing a new number.
• Align the text to the Left, Center, or Right inside the box.
• Change the Font Family. Try 'Playfair Display' for an elegant serif look, 'Fira Code' for coding charts, or 'Poppins' for a modern feel.

Images, Tasks & Dates

To make your mind maps truly functional, look for the three subtle buttons pinned to the right edge of your screen. These open the Side Drawers.

Adding Image Backgrounds

Select a node, then click the bottom icon (Picture) on the right side panel to open the Images drawer.

• Search Pexels: Type a word in the search box. Click any photo in the results to instantly set it as the node's background. It automatically adds a dark tint so your text stays readable.
• Upload: Click the Upload button to select a picture from your own computer or phone.

Adding Icons (Emojis)

Click the top icon (Smiley face) on the right side panel. Click any emoji in the grid, and it will be added to the front of the text in your selected node. It is a fast way to categorize ideas visually.

Checklists (Tasks)

Turn a node into a to-do list item. Click a node, then click the Checkmark icon in the main floating toolbar. A small clickable box appears underneath the text. You can click that box directly on the canvas to cross out the text and mark the task as done.

Due Dates

Need to track deadlines? Click the Calendar icon in the floating toolbar and pick a date. It will attach a small, yellow date badge to the bottom of the node.

Gemini AI Features

ApuMindMap integrates Google's Gemini AI to help you build and expand your thoughts without leaving the app.

Generate a Full Map

Click the ✨ AI Generate button in the top menu. Enter a topic (for example, "Digital Marketing Strategy"). The AI will clear the canvas and automatically build a massive, logically structured, multi-colored mind map with main branches and sub-topics.

Expand a Single Node

If you get stuck on a specific idea, let the AI assist. Select a node, then click the gradient AI button in the floating toolbar. A dropdown menu provides smart prompts:

Presentation & Outline View

When your brainstorm is complete, you need a clear way to review or share it.

Presentation Mode

Click the Play button (triangle) in the bottom navigation bar. The interface will vanish, and the camera will automatically zoom in on your root node.

A simple control bar appears at the bottom. Use the arrow buttons (or your keyboard arrows) to step forward. The camera smoothly flies across the canvas, stopping and focusing on each node in hierarchical order. It is like an automated PowerPoint presentation right on the canvas.

Outline View

Click the List icon in the bottom navigation bar. A dark overlay panel appears, converting your visual map into a clean text outline. It uses bullet points and indents to show the structure. You can easily copy and paste this text into Google Docs, Notion, or an email.

Templates & Use Cases

Don't want to start from scratch? ApuMindMap includes built-in templates to kickstart your productivity.

How to use templates

Click the My Maps (Grid) icon in the top left corner. Click New Mind Map. Instead of just pressing Create, click one of the template cards. When you hit Create, the canvas will pre-load with a fully arranged layout.

• SWOT Analysis: Generates a grid layout with Strengths, Weaknesses, Opportunities, and Threats pre-colored and arranged.
• Project Plan: Generates a sequential flow chart with phases for Goals, Team, Schedule, and Budget.
• Book Summary: Generates a creative layout using cloud and circle shapes perfect for dissecting literature.

Save, Sync & Export

ApuMindMap saves your work locally, but provides tools to take your data anywhere.

Automatic Saving

Every edit you make saves automatically to your browser's local storage. You can safely close the tab and return later.

Google Drive Sync

Connect your Google account to sync maps across your phone and computer.

1. Click the Settings (Gear) icon at the top.
2. Click Sign in to Sync. (It requests permission to manage files it creates).
3. Click Save to Google Drive.

Local Export & Import

Open Settings and click Backup to download all your maps as a JSON file. Use the Import button on another device to load them.

Exporting High-Res Images

Click the Download icon (Arrow down) at the top. Choose PNG, JPG, or WebP. The tool calculates the bounds of your map and exports a clean, high-resolution image perfect for reports or pitch decks.

Keyboard Shortcuts

Work faster by keeping your hands on the keyboard.

Troubleshooting

AI Generation says "Failed"

Ensure you have entered a valid Gemini API key in the Settings panel. If the key is correct, your prompt might be too restrictive, or the API might be experiencing heavy traffic. Try generating again.

I lost my maps!

Because ApuMindMap saves data locally by default, clearing your browser cache/history will delete your maps. Always use the Backup button or the Google Drive Sync feature to protect your work.

Cannot see the whole map when exporting

The image export tool automatically calculates the outer edges of your map. Ensure you do not have a tiny node floating thousands of pixels away, as it will force the export to render a massive amount of empty space.