Disseny gràfic de pantalles interactives

Durada: 330 hores

Objectiu: Crear, dissenyar i produir productes per a dispositius web i mòbils centrats en la millora de l’experiència d’usuari, a través de les eines més utilitzades de: creació gràfica d’interfícies, maquetació, codificació i programació en el desenvolupament de continguts per a web i apps per a smartphones i tauletes.

Titulació de batxillerat o equivalent i experiència professional en disseny gràfic.

Mòdul 1

Denominació: Disseny de productes digitals, ús i procés de disseny de productes UI-UX

Objectiu: Dissenyar i produir interfícies d'usuari amb les eines específiques de l'entorn, complint les directrius d'ús i accessibilitat tant per entorns gràfics basats en sistema operatiu, com per aquelles interfícies Web clàssiques i app.

Durada: 180 h

Continguts teoricopràctics:  

1. Disseny de productes digitals. Estudi dels fonaments de l’ús.

   • Principis bàsics del llenguatge visual. Comunicació visual.
   • Estudi del color, la imatge i tipografia.
   • Anàlisi de tendències gràfiques de disseny web i app: Flat design, esqueumorfisme, material design.
   • Llenguatge gràfic. Definició d'un manual d'identitat corporativa.
   • Metodologia del procés de disseny. Definició d'elements, entorn i paleta de producció. Definició de les extensions dels productes finals

2. Creació d'interfícies gràfiques.

   • Creació d'una interfície gràfica acord a l'aplicació de disseny.
   • Creació d'Imatge digital vectorial
   • Creació d'Imatges digitals per bitmap
   • Producció de disseny d'interfícies per app: Adobe Photoshop, Adobe Illustrator, Adobe Indesign.
   • Producció de dissenys a multiplataformes
   • Producció aspect Ratio, HDPI
   • Anàlisi d'interfícies d'Escriptori, Web i App.
   • Estudi de les GUI Android, IOS i Windows phone.
   • Preparació de productes adaptats a dispositius. Concepte disseny multiplataforma, “Mobile First”.
   • Creació de transicions, animació d'interfícies com a suport al UX.
   • Exportació i arxiu d'interfícies.
   • Creació col·laborativa, en la creació d'interfícies en ambients de treball Agile i Scrum

3. Procés de disseny UI- UX, anàlisis, creació de maquetes, aplicació de resultats als prototips

   • Creació d'un procés de disseny estructural Design Thinking
   • Anàlisi del HCI (human computer interaction)
   • Procés de creació de l'arquitectura de la informació.
   • Principis d'ús de Jackob Nielsen
   • Creació d'una maceta d'ús, maqueta heurístiques
   • Avaluació d'una maqueta HeurísticaDesenvolupament d'informes d'ús
   • Realització d'un disseny i mapa d'estructura e interacció
   • Creació de wireframes de l'app triada
   • Creació de mockups i prototips per l'app
   • Estudi i creació de la narrativa d'una app i fases: Alpha, Beta, Release
   • Tècniques de programació. Introducció a la maquetació i funcionalitat 

Mòdul 2

Denominació: Tècniques de Creació i publicació d'interfícies amb llenguatges de marques, script, frameworks, llibreries.

Objectiu: Desenvolupar i publicar prototips d'apps amb els llenguatges d'estructuració, maquetació e interacció necessaris per  estandarditzar les produccions posteriors a interfícies amb tecnologies crossbrowsers i multiplataforma.

Durada: 150 hores

Continguts teoricopràctics:  

1. Creació de prototips amb llenguatge de marques i formatat.

2. Introducció als llenguatges de marques

3. HTML5 i CSS3

   • Tècniques de maquetació i Producció
   • Trasllat de hashtags absoluts a hashtags de maquetació flex.
   • Jerarquia d'etiquetat
   • Metaetiquetes SEO i Accessibilitat
   • Evolució i deprecat

4. Llenguatges de Script

   • Javascript
   • Programació Orientada a objectes
   • L'assignació
   • Sintaxis de Javascript
   • Estructures de control
   • Funcions
   • Gestió d'Esdeveniments
   • Tècniques de simulació de funcionalitat
   • Scripts d'interacció, acompanyament a l'usuari
   • Scripts de millora d'usabilitat

5. Formularis i feedback

   • Eines per la gestió del feedback i comunicació
   • Eines de sincronització de scripts d'usabilitat.
   • Validacions Client – Servidor

6. Àudio i vídeo

   • Contenidors de vídeo
   • Còdecs de vídeo i àudio
   • Alternatives, llibreries
   • Sprites CSS

7. Canvas i dibuix

   • Aplicacions i ús
   • Funcions i propietats
   • Imatges
   • Gradients

8. WebStorage

   • Conceptes previs
   • WebStorage
   • SessionStorage
   • LocalStorage
   • Apis de WebSter

Diploma acreditatiu expedit pel Servei Públic d’Ocupació de Catalunya.