Comment cet ux a-t-il été fait?
Est-ce que quelqu'un sait comment cette image d'interface utilisateur sommaire est faite? S'agit-il de maquettes Balsamiq?
Comme indiqué par eux ( androidpatterns.com ), cela se fait dans Fireworks (voir citation ci-dessous) en utilisant leur propre boîte à outils personnalisée. Vous pouvez télécharger la boîte à outils .
En comparant et en analysant toutes les captures d'écran qui composent ce motif, un choix peut être fait pour l'apparence générique du motif. Nous utilisons Fireworks (CS5) pour créer le filaire. Pour cela, nous utilisons un document de 600 pixels de large, ouvert à partir d'un modèle, et un autre modèle avec graphique éléments. Si un élément ne figure pas encore dans ce modèle, nous le créons et l'ajoutons au modèle. Nous utilisons également un troisième modèle (si nécessaire) avec des gestes. Un maximum de 3 cadres peut être placé sur une même ligne. Des annotations numérotées peuvent être utilisées dans les filaires, qui dirigent le texte annoté sous le filaire. Les chiffres mettent en évidence les sections et étapes importantes. Nous utilisons également des ellipses pour nous concentrer sur une section d'écran particulière, des rectangles pour les tapotements et/ou la sélection et parfois des flèches et des lignes pointillées, le tout dans le modèle filaire.
crayon Evolus comprend un ensemble de pochoirs sommaires. Je ne sais pas si le crayon a été utilisé ou non, mais vous pourriez obtenir un résultat similaire. Voici un exemple de leur galerie de captures d'écran:
Vous pouvez utiliser n'importe quel outil de dessin qui autorise ce style. J'utilise InkScape. Il s'agit moins de l'outil que de l'esthétique. La clé est de lui donner l'air dessiné à la main pour communiquer qu'il ne s'agit pas de l'interface utilisateur terminée.
En fait, je préfère généralement les wireframes dessinés à la main. Crayon + papier.
Oui, ça ressemble exactement à des maquettes Balsamiq pour moi.