Getting familiar with the Framer interface (Fundamentals Lesson 1)

Summary

Cette vidéo offre une présentation complète de l'interface de Framer, en expliquant ses quatre parties principales : la barre d'outils, la barre latérale gauche, la barre latérale droite et le canvas central. Elle détaille les fonctionnalités clés de la barre d'outils, y compris le menu principal, l'ajout d'éléments, le CMS et la barre d'actions rapides. La barre latérale gauche permet de gérer les pages, les calques et les assets, tandis que la barre latérale droite affiche les propriétés contextuelles des éléments sélectionnés. Le canvas central est l'espace principal de création, complété par des outils de navigation, de commentaires et de visualisation. Une introduction claire pour débuter avec Framer et explorer ses fonctionnalités.

Takeaways

• 😀 L'interface de Framer est composée de quatre parties principales : la barre d'outils en haut, la barre latérale gauche, la barre latérale droite et le canevas au centre.
• 😀 La barre d'outils inclut un bouton pour le menu principal, des boutons pour insérer des éléments, un bouton CMS et la barre d'actions rapides pour accélérer le travail.
• 😀 Le raccourci clavier 'I' permet d'accéder directement au panneau d'insertion pour ajouter des pages, sections et composants sans coder.
• 😀 Le menu rapide (Command/Ctrl + K) permet de rechercher des actions et d'apprendre les raccourcis clavier utiles.
• 😀 Au centre de la barre d'outils, le nom du projet et l'URL du site publié sont affichés, avec la possibilité de renommer ou de déplacer le projet.
• 😀 La barre latérale gauche permet de basculer entre les panneaux Pages, Calques et Assets pour gérer la structure et les éléments du projet.
• 😀 La barre latérale droite affiche le panneau de propriétés contextuelles selon l'élément sélectionné, comme les textes ou les points de rupture.
• 😀 Le canevas central est une zone infinie et libre où se déroule toute la création, avec des outils pour naviguer, commenter et zoomer.
• 😀 Les outils du canevas incluent le pan, le commentaire, le mode jour/nuit et des contrôles de zoom avec raccourcis pour une navigation efficace.
• 😀 Framer Academy et la communauté Framer sont des ressources pour apprendre davantage et interagir avec d'autres utilisateurs.

Q & A

Quels sont les quatre principaux éléments de l'interface Framer ?

Les quatre principaux éléments sont : la barre d'outils en haut, la barre latérale gauche, la barre latérale droite et le canevas au centre.

Quelle est la fonction du menu principal accessible via le logo Framer dans la barre d'outils ?

Le menu principal permet d'accéder à de nombreuses actions et préférences du projet, semblable à une barre de menu sur Mac ou Windows.

Comment peut-on ouvrir rapidement le panneau d'insertion pour ajouter des éléments à un projet ?

On peut ouvrir le panneau d'insertion en cliquant sur le bouton correspondant dans la barre d'outils ou en utilisant le raccourci clavier 'I'.

Quel outil dans la barre d'outils permet de rechercher rapidement des actions ou d'apprendre des raccourcis clavier ?

La barre d'actions rapides, accessible via 'Cmd + K' sur Mac ou 'Ctrl + K' sur PC, permet de rechercher des actions et de découvrir les raccourcis associés.

Que trouve-t-on dans la barre latérale gauche de Framer ?

La barre latérale gauche permet de basculer entre les panneaux Pages, Calques (Layers) et Assets, pour gérer les pages, les éléments et les composants du projet.

Comment la barre latérale droite s'adapte-t-elle selon l'élément sélectionné ?

La barre latérale droite affiche un panneau de propriétés contextuel qui montre uniquement les options pertinentes pour l'élément sélectionné, comme les polices pour un texte ou les propriétés d'un breakpoint.

Quelle est la fonction principale du canevas central dans Framer ?

Le canevas central est l'espace de travail principal où toutes les conceptions sont réalisées, sur un canevas infini et libre, contenant des frames appelées Breakpoints.

Quels outils se trouvent en bas du canevas et à quoi servent-ils ?

Les outils incluent l'outil Pan (déplacement), l'outil Commentaire, le basculement jour/nuit et les contrôles de zoom pour naviguer efficacement sur le canevas.

Comment peut-on gérer les collaborateurs et la publication d'un site dans Framer ?

On peut inviter des collaborateurs via le bouton 'Invite' dans la barre d'outils et publier des changements avec le bouton 'Publish'.

Quels raccourcis clavier sont particulièrement utiles pour améliorer l'efficacité dans Framer ?

Quelques raccourcis clés incluent : 'I' pour le panneau d'insertion, 'Cmd/Ctrl + K' pour les actions rapides, et la barre d'espace pour l'outil Pan. Des raccourcis de zoom sont également utilisés pour ajuster rapidement la vue.

Qu'est-ce que le mode Jour/Nuit et quel est son impact sur le site ?

Le mode Jour/Nuit change l'interface Framer et peut également modifier le contenu du site si cette fonctionnalité a été configurée.