Accueil

Créer un prototype dans Keynote

Concevoir une app simple

Créer un prototype dans Keynote

Réalisez un prototype de votre app dans Keynote.

Durée approximative du tutoriel :

40 min

Préparer le prototype dans Keynote

Pour réaliser votre prototype, utilisez la diapositive vide fournie à la section Préparer le prototype dans Keynote de la présentation du projet. Vous pouvez la dupliquer au besoin.

Explorer les outils de Keynote

Familiarisez-vous avec les fonctionnalités de Keynote qui vous seront utiles. Les diapositives qui suivent montrent à titre d’exemple l’app Affirmations positives.

Ajouter des objets

Ajoutez du texte, des lignes et des formes.

Étape 1

Touchez le bouton Formes  et choisissez un objet comme une zone de texte, une ligne ou une forme.

Étape 2

Touchez le bouton Multimédia  pour ajouter des images, dessins, vidéos ou pistes audio.

Étape 3

Pour redimensionner un objet, faites glisser ses poignées bleues.

Étape 4

Double-touchez une forme pour y insérer du texte.

Étape 5

Ajoutez tous les éléments qui composeront votre app et donnez-leur la bonne taille.

Pensez aux titres, aux images et aux boutons.

Ajouter de la couleur

Modifiez la couleur et la transparence des éléments de votre prototype.

Étape 1

Affichez le navigateur de diapositives.

Étape 2

Pour modifier l’arrière-plan, sélectionnez la vignette de la diapositive, puis touchez le bouton Format .

Étape 3

Touchez Arrière-plan et choisissez une couleur, un dégradé ou une image.

Étape 4

Touchez l’onglet Dynamique pour choisir un arrière-plan animé.

Étape 5

Modifiez la couleur d’une forme.

Sélectionnez une ou 
plusieurs formes et touchez le bouton Format, puis Remplissage.

Étape 6

Utilisez le curseur Opacité pour régler la transparence d’un objet.

Sélectionnez l’objet, touchez le bouton Format, puis faites glisser le curseur Opacité.

Étape 7

Servez-vous des commandes à votre disposition pour modifier le style du texte.

Touchez du texte pour 
le sélectionner, touchez le bouton Format, puis allez à l’onglet Texte.

Étape 8

Continuez de peaufiner votre prototype jusqu’à ce que le résultat vous convienne.

Intégrer des éléments interactifs

Rendez votre prototype interactif en ajoutant des liens entre les diapositives.

Étape 1

Déterminez si votre app requiert des transitions ou des éléments interactifs.

Astuce

Pour que votre prototype soit interactif, utilisez de multiples diapositives et modifiez les éléments ou ajoutez-en d’autres.

Étape 2

Pour ajouter une diapositive, touchez la vignette et sélectionnez Dupliquer.

Étape 3

Pour insérer un lien, sélectionnez l’objet et touchez Lien.

Étape 4

Déterminez la destination du lien. Il peut mener vers une diapositive, une page web, une adresse courriel ou un numéro de téléphone.

Astuce

Pour que votre prototype se comporte comme une app, la navigation doit reposer uniquement sur des liens.

Étape 5

Pour changer le type 
de présentation, touchez le titre de votre projet et sélectionnez Options 
de présentation, puis Type 
de présentation.

Étape 6

Sélectionnez Liens uniquement.

Étape 7

Continuez de créer des diapositives et d’y intégrer des liens jusqu’à ce que l’app soit terminée. Touchez le bouton de lecture  et testez les liens à mesure que vous les ajoutez.

Étape 8

Touchez le bouton de lecture  et suivez tous les chemins possibles dans votre app. Y a-t-il des impasses? Au besoin, ajoutez des liens pour veiller à ce que les utilisatrices et utilisateurs ne restent jamais coincés.

Ajouter des animations

Utilisez des animations pour faire apparaître ou disparaître certains objets, ou pour les mettre en valeur.

Étape 1

Pour ajouter une animation, sélectionnez un objet et touchez Animer.

Étape 2

Explorez les diverses options d’animation.

Avec Composition d’entrée , l’objet apparaît à l’écran.

Avec Ajouter une action , l’objet effectue une action.

Avec Composition de sortie , l’objet disparaît de l’écran.

Étape 3

Essayez différentes animations pour trouver celle qui convient le mieux.

Touchez le bouton 
de fermeture  quand vous avez terminé.

Étape 4

Touchez l’animation, modifiez les réglages à votre guise, puis faites OK.

Astuce

Dans une présentation de type Liens uniquement, les animations ne peuvent pas être lancées d’un simple toucher.

Étape 5

Touchez le bouton Ordre  pour modifier 
les réglages de 
la composition.

Étape 6

Pour la première animation, sélectionnez Après la transition.

Étape 7

Pour les animations subséquentes, touchez Après la composition.

Étape 8

Touchez le bouton d’aperçu  pour tester les animations. Continuez d’apporter les modifications nécessaires jusqu’à ce que votre app ait l’apparence voulue et qu’elle fonctionne correctement.

Prochain tutoriel :