De baisse des menus vers le bas - être un maître instantané de menu !
| by Jake Smith | September 14, 2007
Des sites Web instantanés généralement ne sont pas connus pour leur facilité d'utilisation. Presque chaque emplacement a une interface utilisateur non standard, qui peut signifier l'ennui pour vos invités surfants pendant qu'elles passent le temps précieux s'habituant à votre interface utilisateur.
Une interface que la plupart des personnes que le' ve a utilisé un ordinateur pendant plus de 20 minutes peuvent manipuler est le menu de baisse en baisse. Rapide et facile pour faire quand vous savez ce que votre faire, elles sont grand pour les emplacements et les projets qui sont établis avec l'expansion à l'esprit. Ajouter un autre article, ajouter une autre option dans un des menus.
Cet exemple est réellement basé sur un dossier instantané de menu de baisse vers le bas qui peut être trouvé chez http://www.jake-man.co.uk/, un emplacement personnel du mien que j'ai fait au sujet des consoles de jeux vidéo. Car j'ai rassemblé plus de consoles, j'ai dû pouvoir les ajouter au genre spécifique, basé sur le processeur de consoles. Le menu de baisse vers le bas a prouvé une grande manière de manipuler ceci, car je pourrais facilement ajouter plus d'articles dedans au fur et à mesure que cela est nécessaire.
La partie intelligente de ce menu de baisse en baisse est « le bouton invisible », un de chaque les meilleures armes de concepteurs instantanés ! N'importe ce que le projet je fonctionne dessus, je finis vers le haut d'utiliser un bouton invisible quelque part.
Fondamentalement un bouton invisible est simplement un bouton instantané, sans le contenu dans les 3 premières armatures, juste une objet/forme dans le secteur de coup. Vous pouvez augmenter sur ceci pour ajouter des bruits dans l'étape de « excédent », pour des roulements d'un utilisateur au-dessus du bouton invisible, jeux d'un bruit. Il y a beaucoup de toi peut les employer pour, ainsi il est bon de commencer à les employer aussitôt que possible.
De queest-ce que j'ai besoin avant que je commence ?
Vous aurez besoin du flash 5 de Macromedia, qui est sur le CD de couverture
Combien est-il dur ?
Facile - une connaissance des boutons et des étiquettes d'armature et des agrafes de film devrait être toute que vous avez besoin.
Combien de temps prendra-t-elle ?
10-15 minutes
Marcher à travers : Une promenade de 14 étapes à travers du logiciel avec un encavateur pour chacun
étape et 50-60 mots.
Étape 1
Les premières choses d'abord… décident la taille de votre film, taux d'armature et couleur de fond. Vous pouvez changer ces derniers plus tard, mais il peut te donner quelques maux de tête si vous changez rigoureusement des tailles de scène.
J'ai choisi un fond noir, un taux d'armature de 21 fps et une taille de 120 Pixel au loin par 400 Pixel grands.
Étape 2
Il est temps d'ajouter nos options principales de menu. Pour mon emplacement console-connexe, j'ai groupé tout par le processeur. 8 bit, bit 16 et ainsi de suite. Ajouter chaque option de menu comme les morceaux séparés de texte, force choisissent aussi bien la police et la couleur maintenant.
Étape 3
Choisir la première option de menu, et frapper F8 (ou choisir Insert>convert au symbole…) et appeler le movieclip quelque chose de utile. Pour « le morceau du bit 8 » de texte, j'appellerai le movieclip « text-8bit ». Faire la même chose avec tout autre texte séparé d'option de menu.
Étape 4
Choisir maintenant « l'agrafe de film du bit 8 », et faire une autre agrafe de film en frappant F8 encore. Nommer celui-ci « menu-8bit ». Éditer le « menu-8bit » fraîchement créé par double cliquer là-dessus (confondant au début, je sais !) dans la bibliothèque et établi les couches suivant les indications de l'image.
Étape 5
Nous sommes maintenant prêts à commencer à travailler à la façon dont notre menu se comportera. Nous avons besoin d'une armature pour un état inactif de menu, et d'une armature pour quand l'article de menu est cliqué dessus. Ajouter les keyframes sur l'armature 5, et ajouter une étiquette appelée « s'est fermé » dans l'armature 1, et une étiquette a appelé « s'ouvrent » dans l'armature 10.
Étape 6
Nous avons besoin un peu de l'actionscript sur ces 2 armatures marquées, rien principal, juste une commande d'arrêt de garder le film du roulement le long seule. Ajouter la commande à chaque armature suivant les indications de l'image.
Étape 7
Temps pour faire notre bouton invisible. Créer un rectangle dans une couche blanche sous « l'option de menu du bit 8 ». Choisir le rectangle et frapper F8 encore, donner au bouton un nom, je suggèrent « le menu bouton-invisible ». Éditer ce bouton, par double cliquer sur son nom dans la bibliothèque.
Étape 8
Voici l'encavateur intelligent de partie… simplement le keyframe dans « vers le haut » de l'état du bouton et le traînent plus d'à l'armature de « coup ». Ceci devrait avoir comme conséquence un keyframe blanc sur « vers le haut », le « excédent » et de « vers le bas » des états, mais un rectangle dans le secteur de coup.
Le bouton ne donnera aucune rétroaction évidente dans cet état, mais agira en tant que point chaud. Grand pour s'ajouter se boutonne aux photos ou au dessin-modèle…
Étape 9
… mais nous vouloir faire un menu. Ainsi nous devons ajouter quelque chose dans l'armature de renversement du bouton invisible, ainsi copier le rectangle du secteur de coup et choisir Edit>Paste en place pour reproduire le menu. Maintenant vous pouvez changer la couleur, le transparent, ajoutez un effet sain etc. Faire la même chose dans « vers le bas » encadrent trop…
Étape 10
Ainsi nous avons notre option de menu dans la première armature, complète avec un bouton qui a besoin d'un manuscrit… ainsi le clic sur le bouton une fois, ouvrent la fenêtre d'actionscript, et le double clic sur l'aller de commander dans des actions de base. Choisir le type de `: Vue la boîte de jeu d'étiquette' et écrire le `ouvert' dans la boîte, et l'uncheck « vont à et ».
Étape 11
Dans armature « ouverte » de notre menu, nous devons ajouter la liste d'options qui apparaîtront quand notre « bit 8 » le menu est cliqué dessus. J'ai ajouté quelques noms d'essai de quelques consoles… et garde le de dessous juste du premier article de liste où « le bit 8 » apparaîtrait. Créer une nouvelle couche au fond même et ajouter une place de fond, ainsi vos blocs de menu les autres options une fois cliqué.
Étape 12
Dans la couche sous les options de menu dans l'armature « ouverte » je vais traîner « le menu bouton-invisible » dehors de la bibliothèque, une pour chaque option de menu et les remettre à la côte pour s'adapter. Le manuscrit pour chacun de ces boutons détermine où l'utilisateur va quand elles cliquent… dans ce cas-ci, je vais simplement charger une autre page Web dans une armature, vous peut voir le manuscrit dans l'image.
Étape 13
En conclusion, quand l'utilisateur « tombe » le menu, nous voulons retourner au « avons fermé » l'armature. La meilleure manière de faire ceci se produire est d'avoir 3 ou 4 secteurs invisibles énormes de coup pour attraper la souris d'utilisateurs. Créer un autre bouton invisible comme dans l'étape 8, seulement complétant le secteur de coup, et ajouter le manuscrit au nouveau bouton comme dans l'image, puis le reproduire deux fois.
Étape 14
Répéter ceci pour chaque option principale de menu que vous avez besoin. J'ai suivi le processus entier 4 fois pour mon menu. Être sûr de réutiliser les boutons invisibles aussi souvent que possible, comme ceci réduit le volume de fichier final du film. Après tout, un menu simple ne doit pas être 200k fini !
Une interface que la plupart des personnes que le' ve a utilisé un ordinateur pendant plus de 20 minutes peuvent manipuler est le menu de baisse en baisse. Rapide et facile pour faire quand vous savez ce que votre faire, elles sont grand pour les emplacements et les projets qui sont établis avec l'expansion à l'esprit. Ajouter un autre article, ajouter une autre option dans un des menus.
Cet exemple est réellement basé sur un dossier instantané de menu de baisse vers le bas qui peut être trouvé chez http://www.jake-man.co.uk/, un emplacement personnel du mien que j'ai fait au sujet des consoles de jeux vidéo. Car j'ai rassemblé plus de consoles, j'ai dû pouvoir les ajouter au genre spécifique, basé sur le processeur de consoles. Le menu de baisse vers le bas a prouvé une grande manière de manipuler ceci, car je pourrais facilement ajouter plus d'articles dedans au fur et à mesure que cela est nécessaire.
La partie intelligente de ce menu de baisse en baisse est « le bouton invisible », un de chaque les meilleures armes de concepteurs instantanés ! N'importe ce que le projet je fonctionne dessus, je finis vers le haut d'utiliser un bouton invisible quelque part.
Fondamentalement un bouton invisible est simplement un bouton instantané, sans le contenu dans les 3 premières armatures, juste une objet/forme dans le secteur de coup. Vous pouvez augmenter sur ceci pour ajouter des bruits dans l'étape de « excédent », pour des roulements d'un utilisateur au-dessus du bouton invisible, jeux d'un bruit. Il y a beaucoup de toi peut les employer pour, ainsi il est bon de commencer à les employer aussitôt que possible.
De queest-ce que j'ai besoin avant que je commence ?
Vous aurez besoin du flash 5 de Macromedia, qui est sur le CD de couverture
Combien est-il dur ?
Facile - une connaissance des boutons et des étiquettes d'armature et des agrafes de film devrait être toute que vous avez besoin.
Combien de temps prendra-t-elle ?
10-15 minutes
Marcher à travers : Une promenade de 14 étapes à travers du logiciel avec un encavateur pour chacun
étape et 50-60 mots.
Étape 1
Les premières choses d'abord… décident la taille de votre film, taux d'armature et couleur de fond. Vous pouvez changer ces derniers plus tard, mais il peut te donner quelques maux de tête si vous changez rigoureusement des tailles de scène.
J'ai choisi un fond noir, un taux d'armature de 21 fps et une taille de 120 Pixel au loin par 400 Pixel grands.
Étape 2
Il est temps d'ajouter nos options principales de menu. Pour mon emplacement console-connexe, j'ai groupé tout par le processeur. 8 bit, bit 16 et ainsi de suite. Ajouter chaque option de menu comme les morceaux séparés de texte, force choisissent aussi bien la police et la couleur maintenant.
Étape 3
Choisir la première option de menu, et frapper F8 (ou choisir Insert>convert au symbole…) et appeler le movieclip quelque chose de utile. Pour « le morceau du bit 8 » de texte, j'appellerai le movieclip « text-8bit ». Faire la même chose avec tout autre texte séparé d'option de menu.
Étape 4
Choisir maintenant « l'agrafe de film du bit 8 », et faire une autre agrafe de film en frappant F8 encore. Nommer celui-ci « menu-8bit ». Éditer le « menu-8bit » fraîchement créé par double cliquer là-dessus (confondant au début, je sais !) dans la bibliothèque et établi les couches suivant les indications de l'image.
Étape 5
Nous sommes maintenant prêts à commencer à travailler à la façon dont notre menu se comportera. Nous avons besoin d'une armature pour un état inactif de menu, et d'une armature pour quand l'article de menu est cliqué dessus. Ajouter les keyframes sur l'armature 5, et ajouter une étiquette appelée « s'est fermé » dans l'armature 1, et une étiquette a appelé « s'ouvrent » dans l'armature 10.
Étape 6
Nous avons besoin un peu de l'actionscript sur ces 2 armatures marquées, rien principal, juste une commande d'arrêt de garder le film du roulement le long seule. Ajouter la commande à chaque armature suivant les indications de l'image.
Étape 7
Temps pour faire notre bouton invisible. Créer un rectangle dans une couche blanche sous « l'option de menu du bit 8 ». Choisir le rectangle et frapper F8 encore, donner au bouton un nom, je suggèrent « le menu bouton-invisible ». Éditer ce bouton, par double cliquer sur son nom dans la bibliothèque.
Étape 8
Voici l'encavateur intelligent de partie… simplement le keyframe dans « vers le haut » de l'état du bouton et le traînent plus d'à l'armature de « coup ». Ceci devrait avoir comme conséquence un keyframe blanc sur « vers le haut », le « excédent » et de « vers le bas » des états, mais un rectangle dans le secteur de coup.
Le bouton ne donnera aucune rétroaction évidente dans cet état, mais agira en tant que point chaud. Grand pour s'ajouter se boutonne aux photos ou au dessin-modèle…
Étape 9
… mais nous vouloir faire un menu. Ainsi nous devons ajouter quelque chose dans l'armature de renversement du bouton invisible, ainsi copier le rectangle du secteur de coup et choisir Edit>Paste en place pour reproduire le menu. Maintenant vous pouvez changer la couleur, le transparent, ajoutez un effet sain etc. Faire la même chose dans « vers le bas » encadrent trop…
Étape 10
Ainsi nous avons notre option de menu dans la première armature, complète avec un bouton qui a besoin d'un manuscrit… ainsi le clic sur le bouton une fois, ouvrent la fenêtre d'actionscript, et le double clic sur l'aller de commander dans des actions de base. Choisir le type de `: Vue la boîte de jeu d'étiquette' et écrire le `ouvert' dans la boîte, et l'uncheck « vont à et ».
Étape 11
Dans armature « ouverte » de notre menu, nous devons ajouter la liste d'options qui apparaîtront quand notre « bit 8 » le menu est cliqué dessus. J'ai ajouté quelques noms d'essai de quelques consoles… et garde le de dessous juste du premier article de liste où « le bit 8 » apparaîtrait. Créer une nouvelle couche au fond même et ajouter une place de fond, ainsi vos blocs de menu les autres options une fois cliqué.
Étape 12
Dans la couche sous les options de menu dans l'armature « ouverte » je vais traîner « le menu bouton-invisible » dehors de la bibliothèque, une pour chaque option de menu et les remettre à la côte pour s'adapter. Le manuscrit pour chacun de ces boutons détermine où l'utilisateur va quand elles cliquent… dans ce cas-ci, je vais simplement charger une autre page Web dans une armature, vous peut voir le manuscrit dans l'image.
Étape 13
En conclusion, quand l'utilisateur « tombe » le menu, nous voulons retourner au « avons fermé » l'armature. La meilleure manière de faire ceci se produire est d'avoir 3 ou 4 secteurs invisibles énormes de coup pour attraper la souris d'utilisateurs. Créer un autre bouton invisible comme dans l'étape 8, seulement complétant le secteur de coup, et ajouter le manuscrit au nouveau bouton comme dans l'image, puis le reproduire deux fois.
Étape 14
Répéter ceci pour chaque option principale de menu que vous avez besoin. J'ai suivi le processus entier 4 fois pour mon menu. Être sûr de réutiliser les boutons invisibles aussi souvent que possible, comme ceci réduit le volume de fichier final du film. Après tout, un menu simple ne doit pas être 200k fini !
Article Source: http://www.articleset.com

You are welcome to publish or reprint this article free of charge, provided:
- you include the entire article, unchanged, including the "About The Author" box
- all hyperlinks remain active, including the bottom ArticleSet.com link (does not apply to print publications)
- you agree not to hold the authors nor ArticleSet.com liable for any loss profits, expenses, or any other damages resulting from the use or misuse of articles published on this website