UI-komponenttien koodaus AI-avusteisesti

Opit koodaamaan UI-komponentteja hyödyntäen AI-työkaluja.

Kesto

4 viikkoa

Tämä moduuli sisältyy koulutusohjelmaan UX Design Certificate ProgramModuuli on pilottivaiheessa, ja on toistaiseksi vapaaehtoisena lisämoduulina tarjolla maksutta koulutusohjelman opiskelijoille.

Moduulin kuvaus

AI-työkalujen myötä ohjelmointia osaamattoman UX/UI-suunnittelijan on mahdollista oppia muokkaamaan käyttöliittymän ulkoasua koodaamalla. Kehitystiimin toiminta tehostuu, kun UX-suunnittelija voi vastata sovelluksen ulkoasun tuottavista komponenteista, ja ohjelmoijat voivat keskittyä sovelluksen toimintalogiikan ja backendin rakentamiseen. Tässä moduulissa opit suunnittelemaan ja toteuttamaan uudelleenkäytettäviä UI-komponentteja moderneilla frontend-teknologioilla. Kurssilla keskitytään AI-avusteiseen koodaukseen, jota on mahdollista oppia nopeasti ilman aiempaa ohjelmointiosaamista. Esimerkeissä käytettävät teknologiat ovat React, TypeScript ja Tailwind CSS.

Mitä opit

Uudelleenkäytettävien UI-komponenttien toteutus
AI-avusteisen koodauseditorin käyttö lokaaliympäristössä
Githubin käyttö koodin versionhallinnassa
Työskentely ohjelmoijana osana kehitystiimiä
Käytännön harjoituksia ja esimerkkejä

Moduulin sisältö

Johdanto AI-avusteiseen koodaukseen

Parhaat AI-työkalut koodauksessa (Cursor, v0, etc.)
Johdanto Github versionhallintaan
Githubin ja lokaaliympäristön käyttöönotto

UI-komponenttien toteutus

Uudelleenkäytettävyyden periaatteet
Komponenttien suunnittelu Figmassa & koodaus AI:n avulla
React-komponenttien toteutus käytännössä, pohjana Shadcn UI:n komponentit

Storybook-komponenttikirjasto

Johdanto Storybookiin
UI-kirjaston luominen koodattujen komponenttien pohjalta
UI-kirjaston käyttöönotto React-projektiin

UI-komponettien käyttö projektissa

Tässä koulutuksessa emme opiskele sovelluksen koodausta, mutta 'vibe-koodaamme' omilla komponenteilla UI-prototyypin

Kouluttajat

Juha-Antti Huusko

Senior UX Designer & Service Designer

Hei! Minulla on noin 20 vuoden työkokemus UX-alalta: digitaalisesta palvelumuotoilusta, käyttöliittymäsuunnittelusta ja käyttäjätutkimuksesta. Tällä hetkellä työskentelen UX/UI-suunnittelijana B2B-ohjelmistojen parissa. Aiemmin olen työskennellyt mm. UX/UI-suunnittelijana Nokiassa, palvelumuotoilijana Keskossa ja User Experience (UX) -tiimin vetäjänä Torissa. UX/UI-suunnittelua olen tehnyt mm. verkkokauppoihin, SaaS-tuotteisiin, yritysten sisäisiin ohjelmistoihin, mobiilisovelluksiin ja eri alojen startup -yrityksille.

LinkedIn profiili

UX DesignUI DesignPalvelumuotoiluKäyttäjätutkimusMobiilisovelluksetVerkkokaupat