Maitriser les cadres
Un article de XMIX.
| Version du 13 mars 2008 à 22:07 Loic (Discuter | contribs) (→Introduction : Un peu de théorie) ← Différence précédente |
Version du 16 mars 2008 à 17:23 Loic (Discuter | contribs) (→Introduction : Un peu de théorie) Différence suivante → |
||
| Ligne 12: | Ligne 12: | ||
| == Introduction : Un peu de théorie == | == Introduction : Un peu de théorie == | ||
| - | Pourquoi des cadres ? Vaste question qui touche aussi bien à l'esthétique qu'à l'ergonomie... Pour s'ouvrir quelques perspectives (wikipedia): | + | Pourquoi des cadres ? Vaste question qui en entraine une autre, qu'est qu'un cadre ? D'aprés le dico: |
| - | *[http://fr.wikipedia.org/wiki/Cadre_%28art%29 L'art des cadres] | + | |
| - | *[http://fr.wikipedia.org/wiki/Encadrement_%28art%29 L'encadrement] | + | |
| - | Essayons de répondre pour ce qui concerne les d'interfaces utilisateur. Il s'agit avant tout de délimiter visuellement le périmetre fonctionnel d'un composant (fenetre, barre de défilement, ...). Afin de "matérialiser" les interfaces graphiques, un effet de perspective est rendu le plus souvent en utilisant des bordures qui donnent une impression de relief (en général avec un point de vue en haut à gauche de l'écran, càd que l'ombre est en bas à droite des objets graphiques). | + | *"Bordure de bois ou d'autre matière dans laquelle on place un dessin, un tableau, etc." |
| + | *"Espace limité (sens figuré)" | ||
| + | |||
| + | Pour creuser un peu, on peut distinguer deux notions : [http://fr.wikipedia.org/wiki/Encadrement_%28art%29 encadrement] et [http://fr.wikipedia.org/wiki/Cadre_%28art%29 cadrage]. La premiere évoque pluto l'esthétisme, c'est à dire le travail sur la bordure pour mettre en valeur le contenu du cadre. La deuxième notion, surtout relative aux domaines de l'audiovisuel et de la photographie, évoque plutôt le choix de ce qui est représenté (la prise de vue). | ||
| + | |||
| + | Pour en revenir à l'informatique et aux interfaces graphique utilisateur, il s'agit de délimiter visuellement le périmetre fonctionnel d'un composant (fenetre, barre de défilement, ...). Afin de "matérialiser" ces interfaces, un effet de perspective est rendu le plus souvent en utilisant des bordures qui donnent une impression de relief (en général avec un point de vue en haut à gauche de l'écran, càd que l'ombre est en bas à droite des objets graphiques). | ||
| [[Image:schema-relief-bordure.png]] | [[Image:schema-relief-bordure.png]] | ||
| - | Deux exemples trés courant boutons et fenetres. Regardez sur votre écran, vous devez en voir plusieurs, avec différents types de bordure. | + | Deux exemples trés courant : les boutons et les fenetres. Regardez sur votre écran, vous devez en voir plusieurs, avec différents types de bordure. |
| Quelques exemples de bordure de fenêtre : | Quelques exemples de bordure de fenêtre : | ||
Version du 16 mars 2008 à 17:23
Accueil → Documentation → Tutoriels → [ Maitriser les cadres ]
Ce tutoriel va approfondir le travail sur les cadres : arrondis, dégradé, effet de relief, bords personnalisés
| Page en cours de création |
|---|
Sommaire |
Introduction : Un peu de théorie
Pourquoi des cadres ? Vaste question qui en entraine une autre, qu'est qu'un cadre ? D'aprés le dico:
- "Bordure de bois ou d'autre matière dans laquelle on place un dessin, un tableau, etc."
- "Espace limité (sens figuré)"
Pour creuser un peu, on peut distinguer deux notions : encadrement et cadrage. La premiere évoque pluto l'esthétisme, c'est à dire le travail sur la bordure pour mettre en valeur le contenu du cadre. La deuxième notion, surtout relative aux domaines de l'audiovisuel et de la photographie, évoque plutôt le choix de ce qui est représenté (la prise de vue).
Pour en revenir à l'informatique et aux interfaces graphique utilisateur, il s'agit de délimiter visuellement le périmetre fonctionnel d'un composant (fenetre, barre de défilement, ...). Afin de "matérialiser" ces interfaces, un effet de perspective est rendu le plus souvent en utilisant des bordures qui donnent une impression de relief (en général avec un point de vue en haut à gauche de l'écran, càd que l'ombre est en bas à droite des objets graphiques).
Image:Schema-relief-bordure.png
Deux exemples trés courant : les boutons et les fenetres. Regardez sur votre écran, vous devez en voir plusieurs, avec différents types de bordure.
Quelques exemples de bordure de fenêtre :
Image:Exemple-bordure-fenetre.png
Nous allons dans ce tutoriel voir les fonctions offertes par XMIX pour réaliser nos propres cadres et bordures.
