Ce chapitre décrit la plateforme OpenLaszlo du point de vue du graphiste. Nous verrons comment OpenLaszlo permet aux graphistes et ingénieurs de construire des applications Internet innovantes. 

Avec la technologie OpenLaszlo, les graphistes d'applications internet sont libérés des habituelles limitations dues à l'enchaînement statique et linéaire de pages. Votre vision d'interfaces dynamiques, dirigées par les données, concises et intelligentes peut devenir une réalité. Mais peut-être devrez-vous changer un peu votre façon de penser, car OpenLaszlo peut vous permettre de faire des choses qui ne le sont pas avec la plupart des autres technologies. Et même s'il n'est pas nécessaire pour vous d'apprendre à écrire du code pour devenir un designer efficace sur un projet OpenLaszlo, un peu de connaissances de la structure de base et les spécificités du langage vous aideront à comprendre comment appréhender la tâche. C'est pourquoi nous vous recommandons d'au moins parcourir quelques-uns des tutoriels.

Au moment d'aborder un projet, pensez à des applications clientes qui soient si intuitives et faciles à utiliser qu'elles ne nécessitent aucun manuel. Rappelez-vous la superbe interface d'un site Flash et imaginez qu'elle devienne orientée données, qu'elle monte en charge et qu'elle puisse être modifiée facilement. Passez un peu de temps à approfondir la question. Pensez-y sous tous les angles. Coupez-la en petits morceaux, réorganisez les différemment et utilisez ces perceptions pour définir votre design. 

Considérez la ou les tâches que l'utilisateur final doit faire, ainsi que l'enchainement jusqu'à la fin. L'un des avantages d'OpenLaszlo pour construire vos projets est sa capacité à consolider l'information à travers les interactions et la présentation. Un processus qui aurait pris 20 pages html à un utilisateur très patient, peut maintenant s'accomplir dans le cadre d'une seule "page" avec de petits morceaux d'information élégamment organisés suivant les besoins. Cette capacité de présenter les informations d'une façon pratique, adaptée au contexte, et quelle qu'en soit sa complexité, est la base de toute application réussie.

Figure 3.1. Interaction continue

Le processus de design est unique à une équipe en fonction de son expérience et de sa culture. Le recoupement des compétences entre les graphistes qui écrivent du code et les ingénieurs avec des sensibilités artistiques implique qu'il n'y a souvent pas de stricte division du travail. Toutes les équipes ont besoin de passer du temps pour disséquer le problème, faire du remue-méninges, et arriver à une compréhension et un accord unanimes.

Voici quelques étapes reconnues du processus :

Figure 3.2. Processus de design

Pendant que l'équipe technique développe l'infrastructure de l'application, les designers peuvent se concentrer sur l'apparence de l'application. Certains graphistes préfèrent que le design soit complètement fini avant que le développement ne commence, mais la réalité des échéances et la probabilité de changements au cours des itérations nécessitent que l'apparence et la réalisation visuelle se fassent en parallèle du développement. Des éléments fondamentaux du design doivent cependant être décidés. Les utilisateurs seront-ils plus à l'aise avec des interfaces traditionnelles ou est-il possible d'essayer de nouvelles présentations, intéractions et affichages ? L'apparence de l'application doit être celle avec laquelle vous êtes le plus à l'aise.

On peut utiliser aussi bien des outils bitmap que vectoriels pour produire des ressources dans les deux formats.

Les ressources sont les éléments visuels utilisés par le code LZX pour construire l'apparence d'une application. LZX supporte de nombreux formats d'images, aussi bien bitmap (GIF, JPEG, PNG) que vectoriels (SWF). Des animations et vidéos (sous forme de fichiers SWF) ainsi que des sons (fichiers MP3) peuvent aussi être intégrés dans les applications. Les ressources sont souvent constituées de plusieurs parties assemblées pour créer différentes apparences d'interfaces et leurs états (relevé, enfoncé, sélectionné, ...). Pour permettre ces états, LZX autorise des ressources multi-images. Il est également possible d'utiliser une ressource simple et de modifier son apparence à l'aide de code (teinte, taille, position, ...). Dans le langage LZX, la couleur, la teinte, le contraste et l'opacité des ressources peuvent être modifiés de façon programmative. 

Figure 3.3. Utilisation de ressources

La décision de travailler avec des fichiers bitmaps ou vectoriels est dictée par le design. S'il y a beaucoup d'objets complexes, de taille fixe, tels que des dégradés, des ombrages et/ou transparences, des ressources bitmap sont plus adaptées. Les fichiers vectoriels, bien que généralement plus petits, demandent plus de traitements pour s'afficher. L'autre grande considération est de savoir si le design implique le redimensionnement des ressources. Si une ressource doit changer d'échelle, vous devriez utiliser des fichiers vectoriels, car il n'y aura alors aucune dégradation. Redimensionner des fichier bitmap à une taille plus grande que leur taille d'origine va produire une interpolation et une dégradation de l'image. En général, les fichiers SWF sont les plus flexibles. Bien que l'outil de référence pour créer des fichiers SWF soit Macromedia Flash, de nombreuses applications vectorielles, comme Adobe Illustrator, permettent d'exporter vers ce format. Si l'option est disponible, les fichiers SWF doivent être sauvés en version 5.0. Le système d'export de Illustrator 10 ne fournit pas cette option, mais utilise la version 5.0 par défaut. 

	Note
	A l'exception de la commande "stop", aucun code ActionScript Flash ne doit pas être inclus dans un fichier SWF.

OpenLaslo prend en charge toutes les polices au format True Type (TTF). Les polices embarquées permettent de garantir l'apparence du texte à l'intérieur des applications, quel que soit le navigateur et le système d'exploitation. 

La police par défaut dans les applications OpenLaszlo est la police ultra riche "Verity". Le plugin Flash (responsable de l'affichage des fichiers LZX) affiche mal les polices de petite taille, c'est pourquoi les graphistes utilisent fréquemment des polices bitmap à petite taille (généralement moins de 12 points). Les polices bitmap contournent le problème d'affichage en supprimant le lissage. Bien que pratiques, les polices bitmap traditionnelles perdent les nuances de la typographie traditionnelle. Les polices ultra riches utilisent un lissage constant, ce qui augmente la lisibilité en gardant le lissage et la forme distincte des caractères. Verity a été conçu pour imiter les formes de la police "Vera" (également incluse dans le Serveur OpenLaszlo).

Figure 3.4. Polices de caractères

A des tailles plus grandes, Vera peut être utilisée à la place de Verity. Les polices bitmap telles que Verity ne s'affichent correctement qu'à 8pt. Le fichier TTF Verity (9 ou 11pt) doit être utilisé pour changer la taille. Certains caractères de Verity ne sont pas accentués; si vous voulez le pack Windows Occidental Unicode, utilisez VerityPlus, qui contient les caractères accentués européens. La police Vera a été éditée en licence Open Source par le projet Gnome. La police ultra riche Verity a été conçue par Christopher Lowery en utilisant la technologie créée par Truth in Design. 

Pour en savoir plus sur les polices, voir le Guide du Développeur

Pour plus d'informations, voir Design des composants OpenLaszlo.