La navigation sur le web sur différents appareils augmente rapidement. Pour développer une présence en ligne, il est essentiel de créer un site web qui fonctionne sur différentes tailles d'écran. La conception web réactive est une approche qui vise à créer des pages web qui s'affichent efficacement sur toutes les tailles et résolutions d'écran, garantissant ainsi une meilleure convivialité. Une autre approche utilisée par les développeurs pour mettre au point des applications web est la conception "mobile-first". Elle se concentre d'abord sur la conception de produits pour les petits écrans, puis les étend progressivement aux écrans de plus grande taille. D'autres approches d'optimisation des sites web pour différentes tailles d'écran comprennent la conception adaptative et fluide. Les requêtes média sont des filtres pour les styles CSS qui permettent de modifier l'apparence d'un site web ou d'une application en fonction de la taille de l'écran de l'appareil de l'utilisateur. Comme les développeurs utilisent largement le responsive web design, il est essentiel de suivre ses meilleures pratiques. Les développeurs doivent tester le site web ou l'application par le biais de tests inter-navigateurs ou de tests réactifs avant de le lancer. Les applications web progressives (PWA) utilisent des technologies web pour offrir aux utilisateurs une expérience similaire à celle d'une application. Elles utilisent divers cadres et modèles qui leur permettent d'exploiter à la fois les fonctionnalités du web et celles des applications natives. Les applications à page unique (SPA) rapprochent le site web d'une application de bureau, offrant une expérience plus fluide et plus agréable en réduisant le temps de latence entre les pages suivantes. Les travailleurs de service font partie intégrante des PWA. Ils permettent l'accès hors ligne, le chargement rapide, les notifications push et d'autres fonctionnalités. Un site web peut être transformé en PWA en ajoutant des fonctionnalités et en modifiant le code pour qu'il se comporte comme une application sur les appareils mobiles. Les applications PWA peuvent offrir des fonctionnalités similaires à celles d'une application native et même mettre à jour le contenu en arrière-plan afin que les utilisateurs puissent voir le contenu le plus récent.

Figma est un outil de conception basé sur le web qui permet de créer des interfaces utilisateur, des icônes, des wireframes et des prototypes. Ses caractéristiques uniques permettent aux concepteurs de créer et de collaborer à des conceptions numériques de manière efficace et efficiente. Les concepts fondamentaux de Figma sont les cadres, les composants et les couches. Les cadres permettent de regrouper des éléments connexes et de créer des sections dans la conception. Les calques permettent de gérer la visibilité et le positionnement des éléments individuels dans un cadre. La fonction Composant de Figma permet aux concepteurs de construire des composants de conception réutilisables qui peuvent être modifiés et mis à jour en temps réel sur différentes pages et dans différents fichiers. Les composants peuvent être organisés en bibliothèques pour faciliter l'accès et le partage entre les membres de l'équipe. Des styles peuvent également être appliqués aux composants, tels que la typographie, les couleurs et les effets, afin de maintenir la cohérence de l'ensemble de la conception. Les cartes et les mises en page sont des fonctionnalités supplémentaires de Figma qui permettent de regrouper des contenus et des actions connexes dans un conteneur flexible et extensible. Figma offre également une variété de formes d'images et d'outils pour la conception, y compris des formes vectorielles, des images, des icônes, du texte et des plugins. Pour installer et configurer Figma, les utilisateurs doivent créer un compte, choisir un plan et personnaliser leurs préférences en matière d'espace de travail.

Dans ce module, vous allez concevoir et créer une application de vente interactive en utilisant Figma et Thunkable. Figma est un puissant outil de conception d'interface utilisateur utilisé pour créer des wireframes, des prototypes et des conceptions haute-fidélité pour les applications web et mobiles. Thunkable est une application web bien connue pour ses concepts de programmation visuelle avec un style "glisser-déposer", ce qui la rend très facile à comprendre pour tout le monde et permet de créer des applications web mobiles très interactives. Pour créer l'application de vente interactive, vous pouvez concevoir la présentation et les caractéristiques à l'aide de Figma, exporter les actifs Figma vers Thunkable, créer des fonctionnalités à l'aide de composants préconstruits et tester l'application sur un appareil mobile ou à l'aide de la prévisualisation Web.