1. Mettez votre marque en premier

Votre marque représente l'association intellectuelle et émotionnelle que les gens font avec votre entreprise, votre produit ou votre application. Alors pourquoi ne pas commencer à concevoir votre application en y intégrant d'abord votre marque ? Mendix Personnalisateur de thème, vous pouvez intégrer les couleurs, la police et le logo de votre entreprise dans la conception de votre application.

L'intégration du logo avec une combinaison de polices de caractères et de palettes de couleurs distinctes de votre marque permet d'adapter les éléments de base et les widgets à votre identité, éliminant ainsi les changements de style ponctuels. Lorsque vous commencerez à créer votre application, vous ressentirez un véritable sentiment d'appartenance, car l'application reflète la marque unique de votre entreprise.

Pour accéder au personnalisateur de thème, cliquez sur l'icône Pinceau en bas à gauche de l'écran. Mendix Modélisateur Web.

2. Commencez avec un modèle

Je ne sais pas pour vous, mais une toile vierge peut être parfois écrasante lorsque ma vision n'est pas claire. Heureusement, Mendix fournit une bibliothèque de modèles substantielle construite avec le framework Atlas UI pour lancer le développement d'applications. Les modèles de page sont un excellent moyen de gagner du temps et de laisser libre cours à votre créativité. Chaque modèle de page comprend une interface utilisateur entièrement conçue avec des blocs de construction et des widgets prêts à être connectés.

Vos utilisateurs passeront la majorité de leur temps à utiliser d'autres interfaces utilisateur que la vôtre (Facebook, Twitter, sites d'actualités, etc.). Il n'est pas nécessaire de réinventer la roue. Les modèles Atlas (cartes, fils d'Ariane, en-têtes de héros, menus hamburgers, etc.) sont tous conçus à partir de modèles établis que l'on trouve partout sur le Web et constituent des solutions aux problèmes courants d'interface utilisateur. Enchantez et satisfaites vos utilisateurs, plutôt que de les frustrer et de les ennuyer, grâce à des décisions de conception intelligentes.

3. Familiarisez-vous avec Flexbox, votre nouveau meilleur ami

Étrangement, l’une des tâches les plus difficiles à réaliser lors de la création d’applications Web et mobiles est le centrage du contenu. Le centrage horizontal du contenu est relativement facile, mais le centrage vertical est presque toujours délicat. Il suffit de rechercher sur Google « centrage CSS » pour trouver de nombreux blogs sur les astuces permettant d’accomplir ce qui devrait être une tâche simple, soulignant à quel point il est difficile d’y parvenir.

Heureusement, Mendix a ajouté un certain nombre de blocs de construction flexbox intéressants :

• Conteneur flexible à gauche
• Conteneur flexible Centre gauche
• Conteneur flexible à droite
• Conteneur flexible au centre droit

Avec Flexbox, vous pouvez aligner n'importe quoi (verticalement ou horizontalement) sans douleur grâce aux propriétés align-content.

Flexbox présente également d'autres avantages. Il est idéal pour les écrans mobiles et le contenu réactif, car les éléments de votre conteneur Flexbox peuvent « fléchir » leurs tailles pour répondre à l'espace disponible. Il est indépendant de la direction, contrairement au mode de mise en page en bloc/en ligne (le bloc est vertical, l'en ligne est horizontal), ce qui signifie que vous pouvez organiser votre contenu dans n'importe quelle direction (à gauche, à droite, vers le bas ou vers le haut). Vous ne dépendez plus non plus des flotteurs et des «clairfix" hacks car Flexbox gère tout cela pour vous.

Vous pouvez trouver des guides pour apprendre Flexbox ici.

4. Préserver et renforcer la cohérence autant que possible.

La cohérence de votre application consiste à rendre les choses continues, prévisibles et conformes aux attentes. Le choix des blocs de construction, des modèles de page et des widgets est important en raison de la maintenance de l'application et, plus important encore, de l'expérience utilisateur.

« Plus les attentes des utilisateurs se révèlent justes, plus ils se sentiront en contrôle du système et plus ils l'apprécieront. » – Jakob Nielsen

Lorsque la cohérence est présente dans la conception des applications, les utilisateurs transfèrent les connaissances vers de nouveaux contextes sans effort. Par exemple, en utilisant la couleur verte pour «boutons de sauvegarde" associera le vert au "enregistrer" action. Les utilisateurs savent sans effort cognitif quelle interaction d'interface utilisateur se produira lorsqu'ils verront des boutons verts dans toute l'application. L'établissement de modèles comme dans l'exemple ci-dessus facilite le développement et la convivialité de vos applications.

5. Utilisez les éléments de conception comme tremplin créatif

J'ai déjà mentionné comment les modèles d'interface utilisateur Atlas aident à démarrer le développement d'applications. Cependant, Atlas UI est bien plus que des modèles de pages, des blocs de construction et des widgets pré-packagés. Les composants fournis sont un tremplin pour la mise en œuvre de votre propre langage de conception d'entreprise.

Commencez votre voyage dans le langage de conception en téléchargeant le Application de référence de l'interface utilisateur Atlas du Mendix App Store. À partir de là, commencez à personnaliser les blocs de construction, les modèles de page et les widgets de l'interface utilisateur Atlas préconfigurés, puis travaillez à la création des vôtres. En investissant dans un langage de conception d'entreprise, vous fournirez un ensemble unifié de règles d'expérience utilisateur et de conception à l'ensemble de votre portefeuille d'applications et de votre équipe, accélérant ainsi la transition de la conception au développement.

6. Expérience

La seule façon de savoir ce qui fonctionne et ce qui ne fonctionne pas est d'expérimenter. L'interface WYSIWYG du Web Modeler est un excellent outil pour faciliter l'expérimentation, car vous pouvez facilement créer de nouvelles idées en modifiant les blocs de construction et les widgets, ou en ajustant les propriétés de conception des éléments de conception existants. Plus vous expérimentez avec Atlas UI, plus vite vous comprendrez les éléments UX/UI qui améliorent l'engagement, par rapport à ceux qui provoquent la frustration ou l'abandon.

Utiliser l'application Atlas UI pendant que vous travaillez

L'application mobile Atlas UI récemment lancée vous permet de parcourir tous les modèles de page, les blocs de construction et les widgets sur votre téléphone mobile. Explorez les solutions Atlas UI où que vous soyez. Vous pouvez même l'utiliser pendant la modélisation afin de ne pas avoir à revenir sans cesse à votre navigateur.

Allez-y maintenant et créez quelque chose d'incroyable dans Atlas UI. Téléchargez le Mendix Mobile App pour l'inspiration.