Diseño web

L’assignatura de Disseny web pretén dotar l’alumne d’una visió panoràmica del procés d’ideació i producció de projectes web, tant des de la vessant gràfica com des de la tècnica.

Es tractaran les especificitats del disseny web aplicades al projecte i es durà a terme una introducció als llenguatges de maquetació i programació que ha de dominar un dissenyador front-end. En paral·lel, l’alumne aprofundirà en el coneixement l’àmbit web, tant de l’evolució al llarg del temps com de les tendències actuals i futures.

D’aquesta manera, un cop acabat el curs, l’alumne disposarà dels coneixements necessaris per desenvolupar un projecte web complet.

Objectius formatius

  • Conèixer el context actual i passat del disseny web.
  • Conèixer les especificitats del disseny web.
  • Dur a terme un procés de disseny web en totes les fases.
  • Conèixer les tecnologies i els fonaments dels llenguatges involucrats en el desenvolupament web front-end: HTML, CSS i Javascript.
  • Familiaritzar-se amb el treball amb gestors de continguts (CMS, Wordpress).

L’assignatura de Disseny web pretén dotar l’alumne d’una visió panoràmica del procés d’ideació i producció de projectes web, tant des de la vessant gràfica com des de la tècnica.

Es tractaran les especificitats del disseny web aplicades al projecte i es durà a terme una introducció als llenguatges de maquetació i programació que ha de dominar un dissenyador front-end. En paral·lel, l’alumne aprofundirà en el coneixement l’àmbit web, tant de l’evolució al llarg del temps com de les tendències actuals i futures.

D’aquesta manera, un cop acabat el curs, l’alumne disposarà dels coneixements necessaris per desenvolupar un projecte web complet.

Objectius formatius

  • Conèixer el context actual i passat del disseny web.
  • Conèixer les especificitats del disseny web.
  • Dur a terme un procés de disseny web en totes les fases.
  • Conèixer les tecnologies i els fonaments dels llenguatges involucrats en el desenvolupament web front-end: HTML, CSS i Javascript.
  • Familiaritzar-se amb el treball amb gestors de continguts (CMS, Wordpress).
  1. Procés de creació d’un web:
    1. Briefing.
    2. Mapa web.
    3. Prototipatge de baixa i alta fidelitat: wireframes.
    4. Maqueta gràfica.
    5. Prototip interactiu.
  2. Aspectes gràfics específics del disseny web:
    1. Color.
    2. Tipografia.
    3. Formats d’imatges per web, optimització i exportació.
    4. Layout: ús de retícula i responsive design.
    5. Sistematització: guia d’estil i design systems.
  3. Programes: Sketch i Figma.
  4. Aspectes tècnics del disseny web:
    1. Creació, estructura i publicació al servidor d’un lloc web.
    2. Maquetació web: HTML i CSS.
  5. Disseny per a gestors de continguts. Wordpress:
    1. Utilització de themes de Wordpress.
    2. Creació i personalització d’un tema fill.
    3. Introducció a la programació.
  6. Anàlisi del context web:
    1. Evolució del grafisme web.
    2. Context actual i escenaris de futur.

Metodologia docent

La primera part del curs es centra en el coneixement del mitjà, les seves característiques específiques i l’aprenentatge de les tècniques necessàries per desenvolupar un projecte web.

Es duran a terme sessions guiades combinades amb la realització d’un projecte on es posaran en pràctica els conceptes i tècniques explicats a classe. A banda dels conceptes tècnics, s’introduiran els programes informàtics amb els quals dur a terme els projectes.

A les sessions presencials es realitzarà el seguiment de cada fase del projecte en que es discutiran els diferents aspectes tractats, així com el seguiment individual i la resolució de dubtes tècnics.

La segona part es centrarà en el treball amb un gestor de continguts per familiaritzar-se amb els sistemes més habituals de publicació de continguts. Es durà a terme el desenvolupament d’un portfoli personal en Wordpress, d’entrada de manera guiada i posteriorment en mode taller per resoldre els dubtes individuals.

En ambdós casos, es farà una presentació de treballs i avaluació de resultats del projecte un cop completats.

En paral·lel, es realitzaran dos breus treballs d’anàlisi que l’alumne haurà de treballar de manera autònoma, i dels quals se n’exposaran les conclusions a classe.

Activitats formatives

  • Projecte de disseny i maquetació web: 40%
  • Creació d’un portfoli amb un gestor de continguts (Wordpress): 20%
  • Exercici de programació: 20%
  • Treball d’anàlisi: mirada al passat i prospecció de futur: 20%

Sistema d’avaluació

Avaluació continuada

L’objectiu de l’avaluació continuada és que l’estudiant pugui conèixer el seu progrés acadèmic al llarg del seu procés formatiu per tal de permetre-li millorar-lo. A partir de la segona matrícula, l’avaluació de l’assignatura podrà consistir, a decisió del professor, en una prova de síntesi, que permet l’avaluació dels resultats d’aprenentatge previstos en la guia docent de l’assignatura. En aquest cas, la qualificació de l’assignatura correspondrà a la qualificació de la prova de síntesi.

Normativa general d’avaluació

Per considerar superada una assignatura, caldrà que s’obtingui una qualificació mínima de 5,0.

Una vegada superada l’assignatura, aquesta no podran ser objecte d’una nova avaluació.

Es considerarà “No Avaluable” (NA) l’estudiant que no hagi lliurat totes les evidències d’aprenentatge o no hagi assistit al 80% de les classes sense haver justificat les absències. En cas d’absència justificada, l’estudiant s’ha de posar en contacte amb el professor en el moment de la reincorporació per determinar la recuperació de les activitats a les quals no hagi assistit.

En cas que l’estudiant realitzi qualsevol irregularitat que pugui conduir a una variació significativa de la qualificació d’un acte d’avaluació, es qualificarà amb 0 aquest acte d’avaluació, amb independència del procés disciplinari que s’hi pugui instruir. En cas que es produeixin diverses irregularitats en els actes d’avaluació d’una mateixa assignatura, la qualificació final d’aquesta assignatura serà 0.

Procés de revisió

La revisió es pot sol·licitar al professorat corresponent i es realitzarà durant la setmana indicada al calendari lectiu.

Procés de reavaluació

No es contemplen sistemes de reavaluació en els casos de les pràctiques externes, els TFG, i les assignatures / activitats formatives que, pel seu caràcter eminentment pràctic, no ho permeten.

Per participar a la reavaluació l'alumnat ha d'haver estat prèviament avaluat en un conjunt d'activitats el pes de les quals equivalgui a un mínim de dues terceres parts de la qualificació total de l'assignatura o mòdul.

Jeremy Keith. Resilient web design. 2017.

Kohlmatova, Alla. Design systems. Smashing Media GmbH, Lübeck, Germany, 2017.

Brad Frost. Atomic web design.

Jason Santa Maria. On web Typography. A Book Apart, 2014.

Tim Brown. Flexible typesetting. A Book Apart, 2014.

Steve Krug. No me hagas pensar. Pearson Educación, Madrid, 2001.

Steve Krug. Rocket Surgery made easy. New Riders, Berkeley, 2010.

SuperHi. Learn to code. 2017.

Jeremy Keith. HTML5 for web designers. A book apart, New York, 2010.

Dan Cederholm. CSS3 for web designers. A book apart, New York, 2010.

Ethan Marcotte. Responsive web design. A book apart, New York, 2011.

Rachel Andrew. The new CSS Layout. A book apart, New York, 2017.

Khoy Vinh. Ordering disorder: grid principles for web design. New Riders Press, 2010.

John Maeda. Las leyes de la simplicidad. Ed. Gedisa, Barcelona, 2006

Bibliografia completa i actualitzada.

Competències específiques

Competència

CE3. Sintetitzar aquells coneixements i habilitats d’expressió plàstica, de tècniques de representació i de materials i tecnologies productives que permetin plantejar i desenvolupar projectes de disseny.

Resultats d'aprenentatge

CE3.14. Aplicar els recursos de disseny assistit per ordinador a les diferents fases del projecte: conceptualització, formalització i presentació.

Competència

CE9. Demostrar conèixer i estar familiaritzat amb l’ús del mitjà audiovisual, l’entorn digital i les seves eines de creació i producció.

Resultats d'aprenentatge

CE9.5. Dominar a nivell d’usuari els diferents tipus de programes informàtics necessaris per al desenvolupament de projectes de disseny.

CE9.7. Utilitzar programes professionals de maquetació de pàgina i produir plantilles.

Competències transversals

CT5. Dominar el mitjà informàtic i les tecnologies digitals.

CT11. Capacitat d’adaptació a l’entorn professional nacional i internacional i, en particular, als canvis tecnològics, socials i econòmics que es van produint.

Informació

Código
105736
Créditos
6
Curso
3
Semestre
2
Profesorado
Lenguas
Catalán