Een stijlgids voor apps maken
Een cursus van Christian VizcarraSenior productontwerper
Een cursus van Christian Vizcarra, Senior productontwerper
Leer een stijlgids documenteren en maken met Sketch of andere UI-ontwerpsoftware
Een van de belangrijkste elementen voor het ontwerpen van mobiele applicaties is de stijlgids of visuele stijlgids, die dient als documentatie en gids voor alle teams die betrokken zijn bij het maken van de app, vooral programmeurs die de ontwerpen moeten implementeren. In deze cursus leer je style guide zodat deze er niet alleen goed uitziet maar ook nog eens zeer functioneel is.
Christian Vizcarra —Productontwerper en cursusdocent Ontwerp van een mobiele applicatie - heeft meer van 9 jaar digitale producten maken, erkend door CSS Design Awards, Behance en Awwwards, en in deze cursus leert hij je alle componenten te documenteren, communiceren en exporteren om een professionele stijlgids
Wat leer je tijdens deze online cursus?
20 lessen & 8 aanvullende bronnen
Wat gaan we doen in de cursus?
38 seconden
Wat is een stijlgids?
5 minuten, 18 seconden
Verschillen tussen stijlgids en UI Kit
3 minuten, 35 seconden
Goede praktijken om een stijlgids te maken
4 minuten, 50 seconden
Hoe symbolen maken?
16 minuten, 1 seconde
Lay-out
9 minuten, 24 seconden
Wat is inbegrepen in deze cursus?
Eerst maak je kennis met Christian, zijn professionele carrière, zijn ervaring met het maken van digitale producten en het doel van zijn cursus, het maken van stijlgidsen voor mobiele applicaties.
Je zult zien wat een style guide , waar het voor is en waarom het zo belangrijk is bij het creëren van een digitale web- of applicatie-ervaring. Je zult ook zien wat een UI Kit is, waar het voor is, de kenmerken en de verschillen die het heeft met de visuele stijlgids die je in deze cursus gaat maken. U sluit de eerste unit af door voorbeelden van goede praktijken te bekijken om uw handleiding op te bouwen.
Vervolgens ga je alle elementen bekijken waaruit een stijlgids , je leert ze definiëren, documenteren en exporteren. Je begint met de symbolen: hoe je ze maakt en hoe belangrijk ze zijn; en je gaat verder door de layout , het grid , de soorten ruimtes die er zijn en de kleuren.
Daarna stop je bij typografie, leer je over hiërarchieën, hoe je formaten, gewichten, stijlen en alles wat je nodig hebt om consistentie in je digitale product te genereren, documenteert.
U zult zien hoe u pictogrammen kunt maken en wat het juiste proces zou moeten zijn om de iconografie van uw project te documenteren. Bovendien zult u begrijpen hoe u de UI-componenten moet documenteren: onder andere knoppen, formulieren, kaarten.
Ten slotte leert u hoe u een -stijlgids al is gemaakt, kunt toepassen op een nieuw product en hoe u de -items voor programmeurs kunt exporteren.
Aanbevolen software en tools voor deze cursus
Wat is het cursusproject?
U maakt een stijlgids voor een mobiele applicatie.
Projecten van studenten van de cursus
Voor wie is deze online cursus bedoeld?
Beginnende ontwerpers, UI / UX junioren en iedereen die geïnteresseerd is in design en betrokken is bij het maken van een digitaal product.
Vereisten en materialen
Je hebt basiskennis nodig van webdesign en mobiele applicaties, en basishandelingen van Sketch of een andere applicatie voor het ontwerpen van interactieve webervaringen of apps.
Wat betreft de materialen heb je een computer nodig met Sketch (denk eraan dat Sketch alleen met Apple werkt) of andere ontwerpprogramma's zoals Figma, InVision, Adobe XD (deze 3 werken onder andere op Windows en Apple).
Beoordelingen
- 1 jaar geleden
Excelente curso. Só faltou material de apoio. Poderia ter uma versão com o figma
- 1 jaar geleden
excelente curso , me gusta que el workflow sea en sketch.
- 2 jaar geleden
Excelente curso, me ha gustado y mejor aun muy bien explicado. :D
- 2 jaar geleden
Awesome course!
- 2 jaar geleden
Curso muito bom!!! Abriu meu horizontes para a área e me instigou a querer estudar ainda mais!!
Als gepassioneerd door ideeën, verkent hij altijd nieuwe manieren om nieuwe vaardigheden en technieken te leren om als ontwerper te evolueren, vandaar zijn persoonlijke project genaamd The Design Project, een non-stop ontwerpuitdaging van 60 dagen. Zijn werk is erkend door Awwwards, Behance en CSS Design Awards.
Inhoud
- U1
Hoi!
- Presentatie
- invloeden
- Wat gaan we doen in de cursus?
- U2
Introductie
- Wat is een stijlgids?
- Verschillen tussen stijlgids en UI Kit
- Goede praktijken om een stijlgids te maken
- U3
Elementen in de stijlgids
- Hoe symbolen maken?
- Lay-out
- Spaties
- Kleuren
- Typografie
- Iconografie
- UI-componenten deel 1
- UI-componenten deel 2
- UI-componenten deel 3
- UI-componenten deel 4
- UI-componenten deel 5
- U4
Een stijlgids toepassen
- Mijn stijlgids toepassen
- Middelen exporteren voor programmering
- En als er veranderingen zijn
- EP
Eindproject
- Een stijlgids voor apps maken
Wat kan je verwachten van een cursus van Domestika
Leer in je eigen tempo
Geniet van thuis leren, zonder lesroosters en in je eigen tempo. Jij beslist wanneer je verder gaat met het volgende onderdeel.
Leer met de beste professionals
Leer de meest bruikbare methoden en technieken van de beste professionals in de creatieve industrie.
Ontmoet deskundige docenten
Iedere docent brengt kennis met passie over, biedt duidelijke uitleg en een professioneel perspectief bij elke les.
Certificaten
PLUSAls Plus-lid krijg je voor elke cursus een persoonlijk certificaat, ondertekend door je docent. Deel het in je portfolio, op social media of waar je maar wilt.
Zorg dat je op de voorste rij zit
Dankzij de hoge kwaliteit van de video's mis je geen enkel detail. Dankzij de onbeperkte toegang kun je de lessen zo vaak bekijken als nodig is om je vaardigheden te perfectioneren.
Deel kennis en ideeën
Stel vragen, krijg feedback en bied oplossingen aan. Deel je leerervaringen met andere studenten in de community die net als jij een passie hebben voor creativiteit.
Maak contact met een wereldwijde creatieve community
Deze community heeft miljoenen gebruikers van over de hele wereld, nieuwsgierig en enthousiast om hun creativiteit te verkennen en te uiten.
Geef cursussen op een professionele manier
Domestika selecteert zorgvuldig haar docenten en produceert iedere cursus in eigen huis om een uitstekende online leerervaring te garanderen.
Veelgestelde vragen
You’ll learn how to create, document, and implement Style Guides, manage UI components, improve collaboration between design and development, and achieve visual consistency in digital products using current tools and practices.
This course is designed for those with basic digital design knowledge, perfect for anyone looking to deepen their skills in documentation, Style Guide creation, and working closely with development teams.
Basic digital design skills and familiarity with tools like Sketch or Figma are recommended. You don’t need to be an expert, but you should be interested in documentation and improving collaborative workflows.
You’ll learn to document specifications clearly, create effective Style Guides, and use collaborative tools that reduce errors and make it easier for developers to understand your designs.
A Style Guide is a set of style rules and visual components that ensure consistency and efficiency in designing and building digital products.
You’ll get hands-on experience with tools like Sketch, Figma, Zeppelin, InVision, and Abstract to create, organize, and document interface components and Style Guides.
Yes, you’ll learn how to build UI Kits and understand the difference: a UI Kit is a collection of reusable components, while a Style Guide documents visual rules and specifications.