Visual site map builder
Create your visual site map or app structure using our interactive flow, taking full advantage of drag-and-drop. Dive deeper with page content blocks that make your structure simple to design, handle, and discuss.
![Visual Sitemap Builder | Octopus.do](https://static.octopus.do/media/02/collaboration.png)
![Visual Sitemap Builder | Octopus.do](https://static.octopus.do/media/02/collaboration.png)
![Visual Sitemap Builder | Octopus.do](https://static.octopus.do/media/02/collaboration.png)
Prototype
Visualize with wireframes
With low fidelity wireframes you can visualize contents of each block making it easy to understand the page layout and prepare the content fo your future project.
![Visualize Sitemap With low fidelity Wireframe kit | Octopus.do](https://static.octopus.do/media/05/wireframes-4.png)
![Visualize Sitemap With low fidelity Wireframe kit | Octopus.do](https://static.octopus.do/media/05/wireframes-4.png)
![Visualize Sitemap With low fidelity Wireframe kit | Octopus.do](https://static.octopus.do/media/05/wireframes-4.png)
SHOWCASE
Figma integration
Paste a link to Figma artboard and we will automatically convert the link into a design preview!
![](https://static.octopus.do/media/03/figma.png)
![](https://static.octopus.do/media/03/figma.png)
![](https://static.octopus.do/media/03/figma.png)
Block colors
Organize page content
Organize your page content by highlighting content blocks with color. Develop your color codes and apply them to your projects.
Add a legend to your custom scheme to easily convey color meanings to your team or clients. Always be on one page: define precise descriptions of individual colors to keep things clear.
![Visual Sitemap Maker | Octopus.do](https://static.octopus.do/media/04/color-7.png)
![Visual Sitemap Maker | Octopus.do](https://static.octopus.do/media/04/color-7.png)
![Visual Sitemap Maker | Octopus.do](https://static.octopus.do/media/04/color-7.png)
PRO feature
Export your sitemaps to PDF, PNG, TXT, XML
Have your sitemaps exported as PDF, PNG, TXT, XML. Prepare your material for printing, publishing, offline meetings or exporting. Attach time estimates when needed.
![Export Sitemap to PDF PNG PRINT | Octopus.do](https://static.octopus.do/media/07/export-8.png)
![Export Sitemap to PDF PNG PRINT | Octopus.do](https://static.octopus.do/media/07/export-8.png)
![Export Sitemap to PDF PNG PRINT | Octopus.do](https://static.octopus.do/media/07/export-8.png)
Comments
Collaborate on projects
![Collaborate on Visual Sitemap | Octopus.do](https://static.octopus.do/media/04/comments-7.png)
![Collaborate on Visual Sitemap | Octopus.do](https://static.octopus.do/media/04/comments-7.png)
![Collaborate on Visual Sitemap | Octopus.do](https://static.octopus.do/media/04/comments-7.png)
Share your work with teammates or clients, add comments to keep things clear and in one place. Each comment triggers an email notification to keep every collaborator on track.
Instant updates
Work in real-time
![Create Website Structure in Real-time | Octopus.do](https://static.octopus.do/media/06/real-time-4.png)
![Create Website Structure in Real-time | Octopus.do](https://static.octopus.do/media/06/real-time-4.png)
![Create Website Structure in Real-time | Octopus.do](https://static.octopus.do/media/06/real-time-4.png)
Easily Invite new folk to work on a shared project in real-time. Every change you introduce into a sitemap is instantly picked up by your every teammate.
Useful for UX/UI Specialists, Designers, Project, Account & Sales, SEO Specialists, Freelancers, Developers, Product owners, Product analysts, Copywriters, Marketing Specialists and Digital Agency. See more
PRO feature
Notes and descriptions
Comment your work directly in the sitemap, add notes and block descriptions. Define page content, take meeting notes, and prepare for stand-ups.
![Notes and descriptions for visual site map | Octopus.do](https://static.octopus.do/media/05/notes-4.png)
![Notes and descriptions for visual site map | Octopus.do](https://static.octopus.do/media/05/notes-4.png)
![Notes and descriptions for visual site map | Octopus.do](https://static.octopus.do/media/05/notes-4.png)
PRO Feature
Dark theme
Switch to the dark theme during night shifts or if you simply prefer so. Dark mode can reduce power usage for OLED screens and improve visibility due to higher contrast. Come over to the dark side 🌚
![Visual sitemap Dark theme | Octopus.do](https://static.octopus.do/media/04/dark-theme-5.png)
![Visual sitemap Dark theme | Octopus.do](https://static.octopus.do/media/04/dark-theme-5.png)
![Visual sitemap Dark theme | Octopus.do](https://static.octopus.do/media/04/dark-theme-5.png)
TIP from pro's
We suggest coloring the completed blocks green to track your team’s progress on website development or content planning.
Pro feature
Design for web and mobile
![Create Sitemap for Mobile App | Octopus.do](https://static.octopus.do/media/09/web-and-mobile-4.png)
![Create Sitemap for Mobile App | Octopus.do](https://static.octopus.do/media/09/web-and-mobile-4.png)
![Create Sitemap for Mobile App | Octopus.do](https://static.octopus.do/media/09/web-and-mobile-4.png)
Octopus is case-friendly. Switch your previews to mobile when building for phones or tablets to clearly communicate the type of project you’re up to.
Pro feature
Upload and share designs
![Upload Images for Sitemap | Octopus.do](https://static.octopus.do/media/08/upload-images-8.png)
![Upload Images for Sitemap | Octopus.do](https://static.octopus.do/media/08/upload-images-8.png)
![Upload Images for Sitemap | Octopus.do](https://static.octopus.do/media/08/upload-images-8.png)
Enliven your page designs with images. Map out your website or app structure and add visuals to better convey your ideas and vision.
PRO Feature
Estimate project costs
Octopus.do provides simple project management for your website development and content production flows. Set the production time in hours for each site page or app screen using our estimation panel. Then, our estimates table sums everything up and allows specifying hourly rates, adding extra project stages, and calculating overall costs.
![Website Cost Estimate | Octopus.do](https://static.octopus.do/media/01/estimate-4.png)
![Website Cost Estimate | Octopus.do](https://static.octopus.do/media/01/estimate-4.png)
![Website Cost Estimate | Octopus.do](https://static.octopus.do/media/01/estimate-4.png)
PRO FEATURE
Ghost & Page frames
![Visual Site Mapping Tool | Octopus.do](https://static.octopus.do/media/01/ghost-frames-4.png)
![Visual Site Mapping Tool | Octopus.do](https://static.octopus.do/media/01/ghost-frames-4.png)
![Visual Site Mapping Tool | Octopus.do](https://static.octopus.do/media/01/ghost-frames-4.png)
Keep large sitemaps clear. Organize your website sections in a simple visual manner. For instance, add section names to differentiate site areas like Member and Public. Categorize your layout elements with page frames, use them to mark pop-ups, lightboxes, and page states.
PRO FEATURE
Unlimited site sections
![Create Visual Sitemap | Octopus.do](https://static.octopus.do/media/02/unlimited-sections-6.png)
![Create Visual Sitemap | Octopus.do](https://static.octopus.do/media/02/unlimited-sections-6.png)
![Create Visual Sitemap | Octopus.do](https://static.octopus.do/media/02/unlimited-sections-6.png)
Prototype separate website or app areas in a single sitemap. Get as vast as you want. We don’t limit the number of sections.
Clone everything
Duplicate your projects and pages
Pro plan users can also make project duplicates and create an unlimited number of sitemap archives. Create project drafts or templates and duplicate them in one click. The same goes for pages: create a template page once and easily replicate it across your sitemap.
![Copy Sitemap | Octopus.do](https://static.octopus.do/media/08/clone-4.png)
![Copy Sitemap | Octopus.do](https://static.octopus.do/media/08/clone-4.png)
![Copy Sitemap | Octopus.do](https://static.octopus.do/media/08/clone-4.png)
Only for teams
Invite your team
You can create your team and make a collection of selected projects in one place. Everybody who gets invited to the team will be able to add his own projects and collaborate on the ones already inside. They will have access to all paid features when working with team projects, no matter what the user's account type is.
![Create Sitemap with team | Octopus.do](https://static.octopus.do/media/04/team-4.png)
![Create Sitemap with team | Octopus.do](https://static.octopus.do/media/04/team-4.png)
![Create Sitemap with team | Octopus.do](https://static.octopus.do/media/04/team-4.png)
.xml
Sitemap Generator for Google
![](https://static.octopus.do/media/01/xml-3.png)
![](https://static.octopus.do/media/01/xml-3.png)
![](https://static.octopus.do/media/01/xml-3.png)
Generate sitemap XML from visual sitemap and submit it to Google, Bing and other search engines to improve your visibility and SEO.
.txt
Export visual sitemap to text file
![](https://static.octopus.do/media/06/txt-3.png)
![](https://static.octopus.do/media/06/txt-3.png)
![](https://static.octopus.do/media/06/txt-3.png)
We created a slick, clear and minimalistic TXT file with the structure from your visual sitemap. You can make a presentation with it, hang it on the wall or convert it to CSV so that you can feed it to the robots.
Improve your visibility
SEO Meta Tags
Don’t forget about SEO. Each page has a special form where you can place the most important Meta Tags such as Title, Description and H1-H6 headings. We have taken the necessary steps to ensure you don’t exceed the required length.
Say hello to Google!
![](https://static.octopus.do/media/03/seo-5.png)
![](https://static.octopus.do/media/03/seo-5.png)
![](https://static.octopus.do/media/03/seo-5.png)
import
Visualize any website structure from Internet
You can use our Free Visual Sitemap Generator to import sitemap.xml file to Visualize structure and rework UX.
![](https://static.octopus.do/media/02/import-11.png)
![](https://static.octopus.do/media/02/import-11.png)
![](https://static.octopus.do/media/02/import-11.png)
Connections
Internal links
![](https://static.octopus.do/media/08/internal-links-3.png)
![](https://static.octopus.do/media/08/internal-links-3.png)
![](https://static.octopus.do/media/08/internal-links-3.png)
Sticky notes
![](https://static.octopus.do/media/01/sticky-notes-1.png)
![](https://static.octopus.do/media/01/sticky-notes-1.png)
![](https://static.octopus.do/media/01/sticky-notes-1.png)
Add reminders or leave your thoughts anywhere within project artboard.
Symbols
![](https://static.octopus.do/media/04/symbols-1.png)
![](https://static.octopus.do/media/04/symbols-1.png)
![](https://static.octopus.do/media/04/symbols-1.png)
Speed up your workflow using symbols to reuse common blocks across sitemap.