Comment ils l'ont fait SnoValuation, construit avec Adobe Muse

Comment les professionnels utilisent-ils Adobe Muse? J'ai pris dix minutes pour interroger Robert Tait, l'homme à l'origine de la SnoValuation de 910Zen, à propos de son flux de production Adobe Muse..

L'interview

Décrivez votre flux de travail de conception lorsque vous utilisez Adobe Muse. Quelle est la toute première chose que vous faites? Es-ce que vous dessinez avec du papier et un crayon? Votre flux de travail pour le Web diffère-t-il de celui d'autres médias??

Mon flux de travail dépend généralement du projet et de la créativité du client. Chaque projet commence par un questionnaire détaillé qui nous aide à entrer dans le stade avant même de commencer à jouer avec le design, la mise en page ou l'interface utilisateur..

Je commence habituellement avec un crayon et du papier et commence à dessiner de petites vignettes. Ces idées finissent par devenir plus grandes et plus raffinées. Lorsque je serai satisfait de la position des différentes options, je franchirai le pas pour en faire des compilations grandeur nature (dans ce cas, des sites Web) dans Photoshop. Parfois, l'interactivité est une partie vitale du site Web, il est donc facile de se connecter à Muse pour montrer comment différentes choses pourraient fonctionner..

Je conçois et planifie des sites Web depuis plus de 15 ans et Adobe Muse a complètement modifié mon processus. Auparavant, nous concevions un site Web plat et remettions ces compositions ou ces illustrations aux codeurs pour qu'ils les assemblent. C'était comme concevoir et créer toutes les pièces d'une voiture, mais il fallait ensuite confier toutes les pièces à un mécanicien. Vous pouvez maintenant concevoir, créer et assembler tout en même temps. C'est vraiment révolutionnaire.

Maintenant, je peux laisser Muse faire partie de mon exploration. Je me trouve à construire plus d'interactivité dans les sites Web, car je peux essayer des choses en temps réel et voir les résultats. Tout à coup, un site Web plat et statique n'est plus aussi excitant qu'avant.

Lorsque je travaille sur d'autres projets, tels que des logos ou des brochures, mon flux de travail ne change pas beaucoup. Les idées doivent venir de quelque part et je trouve très gratifiant de commencer avec un crayon et du papier. Si vous sautez sur l'ordinateur et commencez simplement à cliquer, vous êtes soudainement lié par les restrictions uniques des ordinateurs, des logiciels et de chacun des programmes. Je trouve qu’après avoir trouvé les solutions appropriées sur papier, je peux choisir le bon logiciel pour créer ma vision..

Dans quelle mesure utilisez-vous d’autres applications de conception, telles que Photoshop, Illustrator, la synchronisation dans le cloud, par exemple??

Photoshop, Illustrator et Muse sont mes trois grands. Avec ces trois programmes, je peux presque tout faire en tant que concepteur de sites Web. La synchronisation de Creative Cloud a ajouté un niveau de commodité supplémentaire. Soudainement, votre ordinateur portable et votre bureau ont les mêmes préférences. Vous pouvez récupérer n'importe quelle application Adobe (et il y en a beaucoup) à tout moment et l'installer. Les mises à jour sont rapides et faciles, et vous pouvez même télécharger les fichiers sur lesquels vous travaillez pour vous assurer de ne jamais laisser un fichier important sur votre autre ordinateur..

Dans l’ensemble, le Creative Cloud a changé ma façon de travailler, rendant tout beaucoup plus transparent et pratique que jamais auparavant..

Comment avez-vous trouvé le processus Muse en train de passer de la conception statique à l'interactivité dans un navigateur Web??

Lorsque je conçois un site Web, j'essaie toujours de planifier de manière unique pour engager l'utilisateur avec un certain niveau d'interactivité. Ils ne font pas toujours la coupe, et vous devez être conscient de votre cible démographique, ainsi quelques idées restent sur la salle de coupe.

Dans ce cas, nous avons dû mettre de côté plus d’interactivité car son marché cible est celui des propriétaires de chalets de ski ou des banquiers. Ils ont tendance à être sur le site pour les seuls faits. En fait, je suis étonné d’avoir réussi à me démarquer du niveau de conception que j’étais avec ce projet. Heureusement, le propriétaire du site se trouve être assez jeune et branché. Si vous examinez la poignée de sites Web de cette industrie, vous avez tous l’impression qu’ils ont été conçus au milieu des années 90 dans Microsoft Word. Ce site se démarque vraiment de la foule.

Sur les sites où davantage d'interactivité est la bienvenue, je trouve Adobe Muse comme un outil incroyable, car il fournit une foule d'outils «In The Box» (pour ainsi dire), qui vous permettent d'essayer des choses à la volée et de voir ce qui fonctionne et ce qui ne fonctionne t.

C'est rafraîchissant de ne pas dépendre d'un codeur pour traduire ma vision en réalité.

Comment avez-vous envisagé / conçu des éléments interactifs tels que les effets de points de cheminement, où les éléments sont animés au fur et à mesure que la page défile?

Je n'ai pu utiliser aucun de ces effets sur ce site, mais c'est bien d'avoir toutes sortes de trucs dans le mille. Vous ne savez jamais quand un client va demander quelque chose ou avoir besoin de faire sauter ses chaussettes à un moment donné. Toutes les options de défilement de parallaxe sont fantastiques et couvrent une gamme si étendue qu'il est facile d'introduire un mouvement pour montrer un produit, maintenir l'intérêt de l'utilisateur ou simplement s'amuser..

Existe-t-il des aspects de votre site que vous avez trouvé particulièrement difficile à développer avec Adobe Muse??

Le défilement plus complexe de la parallaxe peut prendre quelques expériences pour bien comprendre, mais rien n’apparaît comme trop difficile à intégrer dans Muse.

Sur SnoValuation, j’utilisais initialement des onglets pour basculer entre deux cartes Google (côte ouest et côte est), mais lorsque j’ais basculé entre les cartes de n’importe quel navigateur, la carte (qui se cachait derrière l’autre) ne serait jamais centrée correctement. J'ai finalement découvert qu'il s'agissait d'un bug de Google Map et que cela n'avait rien à voir avec Adobe Muse. Nous avons finalement simplement supprimé la deuxième carte, car l'utilisateur peut facilement naviguer où bon lui semble sur une carte..

Quelle liberté de conception avez-vous eu lorsque vous avez utilisé des composants standard, tels que les formulaires de contact, les carrousels, les cartes, etc..?

Encore une fois, ce site est essentiellement conçu pour les propriétaires de chalets de ski et les banquiers. Je n'ai donc pas eu de règne libre, mais j'ai eu la chance d'avoir un client progressif qui ne voulait pas d'un site d'évaluation «typique»..

Les composants intégrés et le fait qu'il est facile d'intégrer du code où vous le souhaitez le rendent incroyablement flexible. Si vous ne trouvez pas ce dont vous avez besoin dans un widget (et qu'il existe de nombreuses options), vous pouvez généralement intégrer le code d'un site tiers..

Les widgets inclus sont excellents et s’améliorent à chaque mise à jour.

J'ai pu utiliser le formulaire intégré pour la page de contact et intégrer directement Google Maps. C'est génial d'avoir ces éléments dans l'application, et chaque nouvelle version de l'application contient de plus en plus de possibilités utiles.

En apparence, certains de ces widgets ont l'air simplistes, mais c'est incroyable ce que vous pouvez faire, avec les outils standard, avec un peu de créativité..

J'ai déjà été en pourparlers avec le propriétaire du site pour effectuer de nouvelles mises à jour qui intégreront un ensemble des nouvelles fonctionnalités intégrées. J'ai hâte de passer à la deuxième phase.

L’utilisation d’Adobe Muse a-t-elle déclenché des aspects de la conception auxquels vous n’auriez peut-être pas pensé / tenté de tenter??

Utiliser Muse, c'est presque comme utiliser Photoshop. Il n’est pas rare que je commence à construire l’idée initiale dans Photoshop, puis à déplacer certains des éléments bruts dans Muse pour les assembler. Une fois dans Muse, les éléments peuvent être retournés, tournés, redimensionnés, animés, fanés… C’est incroyable ce que vous pouvez faire, et la beauté est que «ce que vous voyez est ce que vous obtenez».  

Adobe Muse ajoute une étape supplémentaire de liberté de création.

Travailler dans Photoshop et confier vos fichiers à un codeur semblaient toujours un peu vides… comme si quelque chose manquait. Maintenant, vous pouvez regarder la magie prendre vie et peaufiner les choses au fur et à mesure.

Les concepteurs n'ont plus aucune excuse pour créer des sites Web ennuyeux..

Avez-vous essayé des outils de Muse que vous n'aviez finalement pas besoin d'utiliser?

Je teste TOUJOURS les nouveaux outils, quand j'en ai le temps. Il y a tellement d'options disponibles qu'il est impossible d'utiliser tout le contenu de chaque site. Il est rentable d'expérimenter chaque outil, car vous ne savez jamais si votre prochain projet bénéficiera de l'un des widgets inclus. J'aime connaître toutes mes options avant de prendre des décisions.

Je suis toujours ravi de recevoir une mise à jour de Muse, qui semble avoir une idée des tendances à venir. Apprendre à utiliser Muse, c'est comme apprendre ce que vos clients sont sur le point de demander..

Une fois que vous avez créé le produit final, avez-vous ressenti le besoin de peaufiner la sortie manuellement?

Heureusement, Muse réussit à regarder et à se comporter de la même manière sur différents navigateurs. Je vérifierai toujours sur le plus grand nombre d'appareils possible pour éviter toute surprise, mais les modifications sont en général minimes..

La seule chose que je devais ajuster était d'élargir les zones de texte de l'en-tête, car j'obtenais une étrange rupture, mais à part cela, il y a très peu d'ajustements non liés à la conception..

Muse offre la possibilité de créer un design séparé pour l’écran, le mobile et la tablette. Comment avez-vous trouvé la conception de versions séparées et avez-vous obtenu le résultat final que vous espériez??

Le site SnoValuation est assez simple, il n’ya donc pas grand chose à perdre dans la réduction de la taille de la version mobile. Dans cette situation particulière, SnoValuation ne demandait pas une taille de «tablette» et j’ai estimé que la version «de bureau» (qui est la version par défaut de la tablette si une version de tablette n’est pas créée) est suffisamment bien traduite pour la laisser tranquille..

Vous ne savez jamais sur quel appareil quelqu'un va consulter votre site Web. C'est donc formidable que Muse propose les trois versions différentes. Cela semble un peu intimidant au début, mais il ne faut généralement pas autant d'efforts pour redimensionner votre site Web pour qu'il soit optimisé pour les deux autres options. Cela nécessite un peu de peaufinage et d’expérimentation, mais cela vaut la peine de faire comprendre votre message, quel que soit le périphérique visualisé par l’utilisateur..

Plus Adobe Muse

Consultez les dernières offres et fonctionnalités d'Adobe Muse sur la page d'accueil d'Adobe Muse..