Sketch de A à Z : Devenez designer UI

Tutoriel de croquis - devenez concepteur UI et UX

Langue: Allemand

Esquisse-Tutoriel - devenez designer UI et UX.

Sketch est un outil efficace et intuitif avec lequel vous créez des prototypes de projets web. Grâce au logiciel UI- et UX, vous créez des interfaces utilisateur dynamiques pour les sites web et les applications. Un avantage essentiel: comme les designs suivent les règles du design web, vous pouvez fournir un résultat directement utilisable pour le développement. Apprenez à utiliser Sketch dans ce tutoriel de plus de cinq heures de Luca Kiedrowski, qui vous guide de manière pratique du concept à un prototype jusqu'à une interface web entièrement conçue.

Deviens designer UI et UX : Crée des interfaces utilisateur pour sites web et applications avec Sketch.
Pour un démarrage rapide : Apprends les bases de Sketch, du design d'UI et d'UX.
Pour ton avancement : Apprends des techniques de design avancées telles que les opérateurs booléens.
Tutoriel pratique : Crée une interface utilisateur moderne pour une application, en prenant l'exemple d'une application.
Meilleure collaboration avec les développeurs : donnez-leur des prototypes directement exploitables.
Comprends en 5 h le concept d'UI et d'UX : le formateur Luca Kiedrowski présente des exemples de bonnes pratiques.
Ainsi, les connaissances acquises restent en tête : y compris des outils de travail pour participer.

Aussi Google et Apple misent sur Sketch - fais comme les grands et apprends maintenant comment créer simplement de beaux designs d'interface utilisateur conviviaux et prêts pour le développement.

Zugriff auf alle Inhalte

In der Mitgliedschaft ab * € monatlich

oder

Inhalt in den Warenkorb

Sofort-Download nach Kauf: einmalig * €

Détails

Utilisable avec:
Contenu: 5 h Formation vidéo
Licence: privée et commerciale Droits d'utilisation
Bonus : y compris le matériel de travail

Catégories

Design (Illustration, Mise en page & Impression)

Créé avec amour par:

Luca Kiedrowski

Exemples d'application

Ouvrir la galerie

Exemple : Dans le tutoriel, vous créez une application évolutive à l'aide de Sketch.
Ouvrir la galerie

Ton formateur te donne des conseils et des astuces pour le design moderne de l'expérience utilisateur et de l'interface utilisateur.

Introduction

Gratuit

Tutoriel de croquis : 1.1 Introduction

Bienvenue au tutoriel de sketch : Apprenez comment concevoir vos propres applications à l'aide du programme. Voici un aperçu du cours.

Au tutoriel de texte Télécharger le fichier de projet

Tutoriel de dessin : 1.2 Qu'est-ce que Sketch ?

Gratuit

Tutoriel de Sketch : 1.2 Qu'est-ce que Sketch ?

Une brève introduction au programme "Sketch" et comment accéder à ce programme.

Au tutoriel de texte

Tutoriel de croquis : 1.3 Interface de programme

Tutoriel de dessin : Interface du programme 1.3

Ici, tu apprends à mieux connaître Sketch. Je te montre le programme complet et tu apprends comment travailler efficacement avec.

Au tutoriel de texte

Esquisse du tutoriel : 1.4 Outils de soutien

Esquisse-Tutoriel : 1.4 Outils

Sketch ne serait pas un si bon programme si on ne pouvait pas utiliser d'outils. Voici comment ajouter ces outils d'aide.

Au tutoriel de texte

Tutoriel de croquis : 1.5 Les plugins les plus importants

Tutorial de esquisse : 1.5 Les plugins les plus importants

Les plugins t'aident à travailler encore mieux et plus rapidement avec Sketch. Je vais te montrer quels plugins peuvent le mieux t'aider.

Au tutoriel de texte

Tutoriel de croquis : Installer les bibliothèques 1.6

Tutoriel de dessin : Installer les bibliothèques 1.6

Avec Libraries, tu peux intégrer directement dans ton projet les designs standardisés d'Apple ou d'Android.

Au tutoriel de texte

Tutoriel de croquis : 1.7 InVision

InVision est un outil qui facilite grandement votre projet Sketch. Là, vous pouvez créer des "maquettes" pour structurer votre projet.

Au tutoriel de texte

Principes de design

Esquisse tutoriel: 2.1 Couleurs

Les couleurs vous offrent la possibilité de donner vie à votre application. Ici, vous trouverez une petite introduction au monde des couleurs.

Au tutoriel de texte

Tutoriel sur les croquis : 2.2 Polices

Le réseau social "Medium" montre à quel point les polices peuvent influencer l'expérience utilisateur. Les polices dans votre application peuvent être très importantes.

Au tutoriel de texte

Créer des prototypes

Tutoriel de croquis : 3 prototypages

Maintenant, commençons avec l'application proprement dite.

Au tutoriel de texte

Conception d'écran

Tutoriel de croquis : 4.1 Écran d'accueil et modèles de conception

Tutoriel de croquis : 4.1 Écran d'accueil et modèles de design

Maintenant, nous nous lançons dans notre vrai projet et commençons par l'écran d'accueil. De plus, tu apprendras ici comment nous pouvons créer des modèles de design.

Au tutoriel de texte

Tutoriel de croquis : 4.2 Créer des groupes et des styles de texte

Dans cette leçon, tu apprendras comment créer des groupes et enregistrer des styles de texte pour gagner du temps.

Au tutoriel de texte

Tutoriel de dessin : trouver, créer et personnaliser des icônes 4.3

Les icônes sont une grande partie d'une application. Dans cette vidéo, tu découvriras où trouver les meilleurs icônes et comment les intégrer dans ton projet.

Au tutoriel de texte

Tutoriel de croquis : Concevoir un design de chat 4.4, travailler avec des calques

Maintenant, passons au chat de notre application. Là, nous travaillons avec des calques, que tu devrais également utiliser pour gagner du temps.

Au tutoriel de texte

Tutoriel de croquis : Design de l'iPhone X 4.5

Tutoriel de croquis : Conception iPhone X 4.5

L'iPhone X a changé certaines choses dans le design des applications. Les designers doivent maintenant travailler avec une nouvelle forme d'écran. Voici les bases.

Au tutoriel de texte

Didacticiel de croquis : 4.6 Profil utilisateur, effet de flou

Esquisse-Tutoriel: 4.6 Profil utilisateur, Effet flou

Avec des effets, vous pouvez donner à votre application un design intéressant. Nous utilisons l'effet de flou dans votre profil utilisateur.

Au tutoriel de texte

Esquisse-Tutoriel : 4.7 Utiliser le design comme outil

Tutoriel de croquis : Utiliser le design comme outil.

Dans cette vidéo, tu découvriras comment tu peux utiliser le design comme outil pour donner une touche finale à ton application.

Au tutoriel de texte

Tutoriel de croquis : Utiliser les bibliothèques 4.8 et créer une feuille d'action

Maintenant, utilisons la bibliothèque iOS pour créer une feuille d'action. Avec les bibliothèques, vous pouvez non seulement gagner du temps lors de la conception, mais aussi lors du développement.

Au tutoriel de texte

Fournir des designs

Tutoriel de croquis : mettre en ligne 5 conceptions sur InVision

Tutoriel de croquis : proposer 5 designs sur InVision.

Si votre application doit être développée, les développeurs ont besoin de vos designs. Dans cette leçon, vous apprendrez comment fournir vos designs sur InVision.

Au tutoriel de texte

Fournir des infos importantes

Tutoriel de dessin : insérer 6 aides dans l'application

Tutoriel de dessin : 6 guides pour intégrer de l'aide dans l'application

Les utilisateurs de l'application ne trouvent souvent pas les bons boutons ou ont d'autres questions qui ne sont pas clairement identifiables. C'est pourquoi nous créons une section de questions-réponses (Q&A).

Au tutoriel de texte

Design professionnel

Tutoriel de croquis : faire réaliser des graphiques de design plat 7.1

Tutoriel de croquis : Création de graphiques de design plat 7.1.

Si vous avez des délais serrés pour vos projets, vous n'avez souvent pas le temps de tout concevoir vous-même. Voici comment et où obtenir de l'aide.

Au tutoriel de texte

Sketch-Tutoriel: 7.2 Réaménagement de la maison

Didacticiel de croquis : 7.2 redécoration de la maison

Sur l'écran d'accueil, nous avons encore beaucoup de marge de progression. C'est pourquoi nous allons refaire le design de notre premier écran.

Au tutoriel de texte

Tutoriel de croquis : 7.3 Expérience utilisateur du processus d'achat

Tutoriel de croquis : 7.3 Processus d'achat de l'expérience utilisateur

Le processus d'achat d'un utilisateur doit se dérouler comme sur des roulettes, car c'est l'un des moments les plus délicats du parcours utilisateur.

Nouveautés dans Sketch

Tutoriel de croquis : 8 Prototypage dans Sketch

Tutoriel de Sketch : 8 Prototypages dans Sketch

Dans la nouvelle version de Sketch, tu as la possibilité de créer un prototype directement dans Sketch.

Au tutoriel de texte

Détails sur le contenu

Comprendre et mettre en œuvre le design d'interface utilisateur et d'expérience utilisateur sur mobile avec Sketch
Que ce soit une application, un site web ou un blog - donnez vie à votre concept de design d'interface utilisateur et d'expérience utilisateur avec Sketch. Dans ce tutoriel vidéo de plus de cinq heures animé par l'instructeur Luca Kiedrowski, vous apprendrez rapidement toutes les bases de l'utilisation du programme pour pouvoir commencer à travailler intensivement sur un exemple de projet de design d'application interactif en peu de temps.

Pourquoi regarder ce tutoriel sur Sketch

En matière de design d'interface utilisateur et d'expérience utilisateur, vous optez directement pour un outil professionnel, car Sketch est également utilisé par des entreprises renommées telles que Google, Facebook et Apple. Grâce à sa facilité d'utilisation, vous maîtriserez rapidement le programme et pourrez obtenir des résultats présentables en peu de temps.

Que vous ayez ou non des connaissances en design : Ce tutoriel sur Sketch est idéal pour vous initier au domaine du design d'interface utilisateur et d'expérience utilisateur, en particulier pour concrétiser vos propres idées de design d'application avec Sketch. Bases et applications réunies !

Si vous concevez déjà des designs pour le web et l'impression (par exemple avec Photoshop ou Illustrator) : Acquérez la capacité de transférer vos designs et des éléments individuels tels que des icônes ou des symboles dans des designs d'interface utilisateur dynamiques et prêts pour le développement. Avec votre expertise en matière de design web, vous ajouterez un atout très recherché (et de plus en plus) à votre CV.

Améliorez la collaboration avec les développeurs web : En utilisant Sketch, vous préparez des interfaces utilisateur qui sont déjà conformes aux règles de conception web. Par conséquent, vous fournissez aux développeurs des designs qui peuvent être directement mis en œuvre. De cette manière, vous raccourcissez considérablement le chemin de la conception et du design à l'application web développée.

Design d'interface utilisateur et d'expérience utilisateur de A à Z avec Sketch

L'accent du tutoriel Sketch est mis sur l'application pratique du programme, disponible en version d'essai gratuite auprès du fournisseur. Avec votre instructeur, vous passerez par étapes pour concevoir un design d'application, de la création d'une esquisse au design d'interface utilisateur final. Les matériaux de travail sont fournis avec le tutoriel, vous permettant de participer directement de manière pratique :

Tout d'abord, vous faites une esquisse grossière de la manière dont l'interface utilisateur de l'application devrait apparaître à l'avenir. Ensuite, vous vous concentrez directement sur la conception. Vous créez l'écran d'accueil, travaillez avec des groupes, des calques et des styles de texte, et sélectionnez des icônes appropriées. Vous concevez une fonction de chat, une aide et un profil utilisateur, et apprenez à utiliser des bibliothèques, des feuilles d'actions et des effets. À la fin, vous obtenez un design d'interface utilisateur complet, à partir duquel vous pouvez même créer un prototype dans la version actuelle 52 de Sketch.

En amont, vous apprendrez les principes de base de Sketch et du design d'interface utilisateur. Ainsi, vous vous familiariserez rapidement avec l'interface, connaîtrez les principaux plugins et outils d'aide, et saurez comment utiliser judicieusement les polices et les couleurs. Votre instructeur vous montrera également quand il est pertinent de combiner Sketch avec InVision, par exemple lors de la phase de la création de wireframes.