Octopus.do<\/a> est \u00ab\u00a0un outil pour cr\u00e9er des sitemaps visuels, rapides comme l’\u00e9clair\u00a0\u00bb, comme ils le disent. Vous pouvez construire la structure de votre site web en utilisant un syst\u00e8me de Content Brick Method<\/a> et la partager rapidement pour collaborer avec votre \u00e9quipe ou vos clients.<\/p>\n Je ne vais pas entrer dans toutes les fonctionnalit\u00e9s de cet outil, je vous laisse naviguer sur la page des fonctionnalit\u00e9s d’Octopus<\/a> si cela vous int\u00e9resse. Je veux partager certaines des fonctionnalit\u00e9s que j’ai utilis\u00e9es, ou que j’utiliserais certainement \u00e0 l’avenir.<\/p>\n Avec Octopus.do, vous pouvez g\u00e9n\u00e9rer rapidement et facilement des diagrammes de sites web propres et agr\u00e9ables \u00e0 l\u2019\u0153il en important le sitemap XML de n’importe quel site web. En fait, sur l’outil, vous pouvez simplement mettre une URL dans un champ, et l’outil d\u00e9tectera le sitemap d\u00e9clar\u00e9 sur votre site Web.<\/p>\n Je parle de cet outil en premier parce qu’il est un peu cach\u00e9 dans l’interface utilisateur de l’outil, mais c’est un excellent moyen de :<\/p>\n Je l’ai essay\u00e9 pour cet article, j’ai utilis\u00e9 le site Suggest.design<\/a>, un de mes projets de site, pour voir comment Webflow<\/a> g\u00e9n\u00e8re un sitemap d’un site \u00ab\u00a0CMS\u00a0\u00bb. Vraiment pas mal.<\/p>\n C’est le genre de d\u00e9marrage dont vous avez besoin pour les sites Web complexes, car vous ne voulez vraiment pas faire tout cela \u00e0 la main.<\/p>\n L’autre aspect int\u00e9ressant de cet outil est que l’aspect visuel du plan du site est bien fait et agr\u00e9able \u00e0 regarder. Le sitemap visuel est color\u00e9 et agr\u00e9able \u00e0 regarder. Il est plus facile de partager ce type de mod\u00e8les avec votre \u00e9quipe et vos clients.<\/p>\n L’avantage est que vous pouvez utiliser une collection de blocs pr\u00e9fabriqu\u00e9s qui vous aideront \u00e0 imaginer le type de contenu que vous attendez \u00e0 un endroit plus ou moins pr\u00e9cis de la page. C’est ce qu’Octopus.do appelle le kit de wireframe basse fid\u00e9lit\u00e9.<\/p>\n C’est un bon moyen d’aider les gens \u00e0 comprendre la structure de la page, la mise en page que vous souhaitez utiliser, mais aussi le type de contenu que vous souhaitez construire. Voici la liste des blocs disponibles (pas tous disponibles dans la version gratuite cependant)<\/p>\n Comme vous pouvez le constater, chaque bloc de contenu que vous ajoutez \u00e0 la page est assorti de plusieurs options \u00e0 c\u00f4t\u00e9 de cette option de mod\u00e8le de contenu :<\/p>\n Je ne sais pas pour vous, mais d\u00e9j\u00e0 ici j’ai \u00e9t\u00e9 surpris par l’outil, dans le bon sens du terme. Petit mais puissant, ai-je pens\u00e9 \u00e0 ce moment-l\u00e0. Mais attendez, ce n’est pas encore la fin.<\/p>\n Sinc\u00e8rement, je n’ai pas utilis\u00e9 ces fonctionnalit\u00e9s pour les deux projets sur lesquels je travaille en ce moment. Je les ai essay\u00e9es par curiosit\u00e9, mais je ne les ai pas utilis\u00e9es en situation r\u00e9elle.<\/p>\n La fonction d’estimation des co\u00fbts est assez simple. Vous pouvez activer une barre lat\u00e9rale qui vous permet d’ajouter des postes de d\u00e9penses sur chaque page du site, en incluant tout ce que vous voulez puisqu’elle est personnalisable. Par exemple ci-dessous sur l’image, vous voyez pour la page d’accueil \u00e0 c\u00f4t\u00e9 du mod\u00e8le 5 lignes d’estimation du temps de travail. A droite, vous avez un tableau avec les postes, les tarifs, les heures et le montant total estim\u00e9.<\/p>\nSitemap builder : quelques fonctionnalit\u00e9s<\/h2>\n
D’un sitemap.xml \u00e0 un plan de site visuel<\/h3>\n
\n
![\"The](\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2021\/12\/octopus-visual-sitemap-builder-generator-xml-import.png\")
<\/a><\/p>\nCr\u00e9ez des sitemaps de qualit\u00e9<\/h3>\n
![\"\"](\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2021\/12\/octopus-visual-sitemap-customized-block-color.png\")
<\/a>![\"\"](\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2021\/12\/octopus-visual-sitemap-block-tools-template.png\")
<\/a>Cette liste de blocs comporte 38 contenus types et \u00e9tait, pour moi, suffisante pour construire mes wireframes basse fid\u00e9lit\u00e9<\/a> directement dans le plan de site visuel.<\/p>\n\n
Ajouter une image et une estimation des co\u00fbts \u00e0 votre plan de site visuel<\/h3>\n
![\"\"](\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2021\/12\/octopus-visual-sitemap-costs-estimation.png\")
<\/a><\/p>\n![\"\"](\"https:\/\/www.creativejuiz.fr\/blog\/wp-content\/uploads\/2021\/12\/octopus-visual-sitemap-image-mode.png\")
<\/a><\/p>\n