Saul Bass (1920-1996) va ser un dels primers a veure el potencial dels títols de crèdit de les pel·lícules. Va fer servir diferents estils (animació, cinema, tractament tipogràfic,..) per crear títols per pel·lícules com Casino (1995) o It's a Mad, Mad, Mad, Mad World (1963). Els seus crèdits no es limitaven a anunciar el personal d'una pel·lícula, també preparaven l'espectador per l'experiència que estava a punt de viure. En els títols de crèdit finals, va crear petites peces que permeten a l'espectador allargar l'experiència viscuda i així tancar la pel·lícula.

Saul Bass va fer servir tècnica tradicional, però l'ús de flash ens permet treballar en animacions amb un estil similar.. Ho provem?

Animació fotograma a fotograma i so.

Fes una animació fotograma a fotograma fent servir fotogrames clau per animar.
Afegeix una cançó fent servir la sincronització d'inici (Inicio).
Exporta-la a video .avi i penja-la al blog.
Respon a aquestes preguntes:
-Quina diferència hi ha entre un fotograma i un fotograma clau?
-Quina diferència hi ha entre la sincronització d'inici i la d'esdeveniment (evento / inicio).

Flash: treballar amb objectes: transformar, alinear i distribuir.

Ex.1. Fes servir les eines de dibuix per crear 6 cercles.
-3 d'ells no han de tenir fil exterior, els altres 3, sí.
-2 d'ells han de tenir un degradat de color lineal, 2 d'ells un degradat de color radial i els altres 2 tindran un color sòlid.
Distribueix-los en el document (coloca els objectes de cada fila a la mateixa distància).

Ex.2.A partir de l'exercici anterior, crea una figura formada per 6 cercles concèntrics de diferents colors. El cercle més gran mesurarà 500 px de diàmetre. El més petit 108 px. de diàmetre.

Mostra en el teu blog el camp d'estrelles i respon a les següents preguntes:
1-Com definiries un símbol?
2-Com definiries una instància?
3-Quines modificacions podem aplicar a una instància?
4-Quines modificacions podem aplicar a un símbol? Com afecten aquests canvis a les instàncies d'aquest símbol?
5-Si canviem el gruix de línea d'una estrella, es modifica el gruix de línea de les altres estrelles?
6-Si canviem la transparència d'una instància, es modifica la transparència de les altres?

Exercici: dibuix amb flash

Fes servir les eines de dibuix de flash per dibuixar aquestes formes.

Fes servir un arxiu de flash diferent per cada figura i guarda el resultat en diferents arxius jpg.

Després, mostra les figures en el teu blog.

Disseny d'interactius: GENERAR EMOCIONS

El producte multimèdia, com qualsevol producte al mercat, serà valorat per la seva funcionalitat (si serveix o no per solucionar un problema determinat), la seva usabilitat (si serà fàcil, còmode i segur de fer anar) i per el plaer que provocarà. U cop solucionada la funcionalitat i la usabilitat, la nostra creació haurà de generar també beneficis emocionals.

Com podem provocar emocions?
Podem provocar emocions a 3 nivells:

-nivell visceral
-nivell de conducta
-nivell reflexiu


El nivell visceral

En aquest nivell, els objectes amb els que interaccionem ens proporcionen plaer d’una forma preconscient. Aquest plaer es produirà a través dels sentits i serà provocat per l’aparença, el tacte, o altres sensacions.

Generar emocions a nivell visceral dependrà principalment de les capacitats dels dissenyadors gràfics i industrials de l’equip. Haurem de fer que la interfície sigui agradable, bonica,... que vingui de gust fer-la anar.

El nivell de conducta


En aquest nivell, els objectes amb els que interaccionem ens proporcionen plaer perquè l’experiència d’ús és positiva. Caldrà que l’aplicació:

-compleixi la seva funció
-tingui un bon rendiment
-sigui fàcil de fer anar (usabilitat): ha de ser fàcil entendre com funciona.

Generar emocions a nivell de conducta dependrà de la bona organització de la informació i de l’ús de la tecnologia apropiada. L’usuari farà servir el producte per satisfer les seves necessitats. És útil observar com fan servir el producte els usuaris per millorar aquest nivell.

El nivell reflexiu

En aquest nivell, els objectes ens proporcionen plaer quan ens evoquen el passat o ens projecten al futur i ens tornen una imatge agradable de nosaltres mateixos. Quan això passa, l’usuari obté una satisfacció personal i es sent identificat amb el producte. Resumint, podem dir que les emocions a nivell reflexiu es produeixen quan donem significat al producte i considerem que transmeten la informació sobre nosaltres mateixos que volem donar.

És el nivell que depèn més del context cultural. Caldrà conèixer bé l’audiència per poder provocar-li emocions en aquest nivell.

Dibuix vectorial amb illustrator

Això és un gif creat amb illustrator

 

això és un gif creat a l'illustrator i modificat al photoshop

feu proves!!

Disseny d'Interfícies. Dissenys Intuïtius

Diem que un interactiu és intuïtiu quan hem de fer poc esforç per entendre com funciona. Però aquesta intuïció, en què es basa?

Segons el diccionari, la intuició és aquell "coneixement directe i immediat, sensible o intel·ligible, d'una realitat o una veritat, sense recórrer a inferència o raonament". L'ús d'una interfície interactiva pot ser més o menys intuïtiu i la intuïció es podrà produir en 3 nivells diferents:

• -Nivell visual (veure)
• -Nivell lector (llegir)
• -Nivell analític (pensar)

Tots tres nivells es combinen i interactuen permanentment entre ells i l'usuari no té per què ser conscient de quina dada ha arribat per quin mitjà.


La intuïció visual

El primer nivell, el visual,  es pot resumir com “l’usuari mira i entén”..
És un nivell que pot ser totalment inconscient. Sense fer cap esforç, l’usuari es pot fer una idea de l’estructura de la pàgina i de els possibilitats d’interacció.
Això és possible pel seu bagatge com a espectador d'audiovisuals en general i com a usuari d’interactius, per la seva experiència anterior.

La intuïció visual es pot aconseguir amb:

• Agrupació visual
• Efectes cromàtics
• Espais entre elements
  
• Posicions dels elements
  
• Proporcions

Exemple:
La intuïció visual, ens permet entendre quin és el títol de la pàgina i on és el menú.


La intuïció lectora

És un segon nivell d’interactivitat. És més potent, però cal que l’usuari faci cert esforç. Té lloc quan l’usuari llegeix les etiquetes o textos. Les paraules parlen per elles soles.

A vegades, però, la capacitat de compendre el text dependrà de l’entorn. Ens hem d’assegurar que el text serà comprensible tot i que l’usuari s’acabi d’incorporar a l’aplicació i no hagi entrat per l’inici, especialment si estem desenvolupant una pàgina web.


La intuïció analítica

Per poder arribar a aquest nivell d’interacció, l’usuari ha de fer més esforç. Ha de recòrrer a conceptes, idees i relacions que no es troben a pantalla. És important conèixer el públic objectiu, per saber quines relacions podrà fer i quines no.

L’usuari ha de fer un esforç i, per tant, hem d’estar segurs que està disposat a fer-ho. Això dependrà de que percebi un benefici.

Per exemple: la interfície d’un programa informàtic pot permetre's introduir icones desconegudes per l’usuari. Perquè si el programa és útil, l'usuari farà l’esforç d’aprendre.

Un interfície serà més intuïtiva com menys analítica sigui la experiència. Això dependrà sobretot de la familiaritat amb el sistema icònic, l’element més analític de la interfície. Si l’usuari està familiaritzat amb les icones, les percebrà clarament a nivell visual i passaran a formar part de la intuïció visual.

Exercici:

Analitza el programa "Premiere" des del punt de vista de la Inuïtivitat:

-Quins elements permeten un ús intuïtiu a nivell visual?

-Quins elements permeten un ús intuïtiu a nivell lector?

-Quins elements permeten un ús intuïtiu a nivell analític?

Il·lustra els 3 nivells amb imatges del programa.
A classe es va comentar que AVID és un programa poc intuïtiu? Com podria millorar?

Redacta una entrada en el teu blog i fes-la pública abans del dia 12 de novembre.







Analitza els 3 nivells d'intuïció a:
http://www.bcn.es/firmament/
http://www.bcn.es/barcelogramas
http://www.lavanguardia.es/servicios/index.html
http://parrilla-tv.lavanguardia.es/
http://horoscopo.lavanguardia.es/
Photoshop

Photoshop. Treball amb capes.

El resultat de l'exercici serà aquest:

A continuació trobaràs el material que podràs fer servir

Fases d'un projecte multimèdia. Pre-producció. El disseny de prototips

Basat en el guió interactiu i el llibre d’estil, es crearan prototips de la interfície gràfica del producte. Aquests prototips només hauran de mostrar l’essència de la interfície gràfica i auditiva.

Caldrà elaborar una sèrie de prototips, per poder així provar i seleccionar el que més faciliti obtenir els resultats desitjats. Els diferents prototips, han d’observar diferents solucions per el disseny i la navegació.

Normalment es treballa la pantalla principal i algunes pantalles secundàries. Amb això n'hi haurà prou per determinar:

• diagramació del text (mides i proporcions dels diferents nivells d’informació)
• colors de fons i  color de text
• tipus de gràfics estàtics i animats.
• mides i estils de imatges gràfiques i en moviment (videos i animacions)
• tipus de sons.
• efectes visuals i transicions

Característiques de la interfície

Un disseny correcte de la interfície permetrà que l’usuari entengui com arribar a la informació i la trobi.

• Tindrà els elements bàsics per guiar l’usuari, però en la quantitat justa per no saturar-lo d’informació.
• Tindrà els elements que permetin a l’usuari saber on és i on pot anar
• Permetrà a l’usuari estar informat sobre els processos de l’aplicació (s’estan carregant les dades, no respon,...)

En resum, podem dir que el disseny permetrà fer usable el producte. Per tant, la seva funció principal és asegurar la USABILITAT.

Un primer pas per afrontar el disseny d’un interactiu és definir la METÀFORA. La metàfora és un recurs expressiu molt important al multimèdia. Permet que l’usuari entengui les possibilitats de l’aplicació, perque aquest fa servir un element que li és familiar: un mapa, una galeria, un escriptori,... La metàfora es representa amb elemets gràfics, però també amb la organització de la informació que seleccionem.

L’ús de metàfores permet més o menys creativitat. Podem fer servir metàfores més comuns o experimentar amb elles.

Exemples:
http://www.lanalandis.com/ 
http://www.youngindy.com/adventures/vol1/myfirstadventure/index.html
http://www.777run.com/run777.htm
http://acidtwist.com/gallery/
http://www.curatingthecity.org
http://www.easylife.org/desktop
http://kids.discovery.com/
http://www.erikotten.nl/7/
http://www.yumfactory.com/eyecandy/index.html
http://www.7designers.com/main.htm

Proves amb els prototips
Aquests prototips han de passar a avaluació: primer del client, després l’equip i els usuaris.

El client pot decidir quin dels prototips s’ajusta a les seves intencions. O pot decidir que cap és bo per els seus objectius. Si és així, caldrà revisar la planificació del projecte i els guions.

L’objectiu de les proves amb l’equip i els possibles usuaris és determinar la capacitat de comunicar correctament la informació i com arribar-hi. S’hi avaluaran els possibles errors i les seves solucions.

Abans de començar amb les proves cal que ens plantegem:

• Qui farà la prova?
• Quina experiència tindrà en l’ús d’ordinadors
• Quin coneixement del mitjà volem que tingui? (per exemple en l’ús d’internet)
• Quina relació tindrà amb el projecte? I amb el tema?
• Quines idees aportarà? Com ens les farà saber? Què estem disposats a canviar?
  

Hem de ser conscients abans de començar de que aquestes proves poden obligar-nos a replantejar el projecte i crear nous prototips.


Les proves poden fer-se individualment o en grup. Abans d’iniciar la prova, informarem a qui seleccionem de:

• Caràcter voluntari de la prova
• Confidencialitat de les respostes
• Anotacions que realitzarem sobre el seu comportament i les seves preguntes
• Possibilitat d’abandonar la prova quan ho desitgin

Fases d'un projecte multimèdia. Pre-producció. Guionatge

El guió del projecte, permetrà tenir un document de treball comú a tot l’equip.
Es composa de diferents blocs:

1-descripció de la idea:
Escriure les conclussions obtingudes durant la planificació, pel que fa a:

• condicionants bàsics 
• Informació 
• Suport informàtic

2-Guió literari:
Descriu l’aplicació de forma senzilla, sense tecnicismes o acotacions específiques (no cal parlar d’aspectes tècnics).

3-Guió interactiu:
Divideix la informació en nòduls i subnòduls i mostra com accedeix l’usuari a cada punt. Es representa visualment amb el mapa de navegació: un dibuix esquemàtic dels diferents nodes, la seva jerarquia i rutes i vies d’accés.

El mapa de navegació és un dibuix esquemàtic dels diferents nodes,la seva jerarquia i les rutes i vies d’accés. És el resultat de dividir la informació en nòduls i subnòduls i mostra com accedeix l’usuari a cada punt.

4-Guió tècnic
És l’equivalent a l’escaleta d’una producció audiovisual convencinal.
Representació de les diferents pantalles i la informació relevant a cadascuna:

• efectes de so 
• diàlegs 
• textos 
• tipus de continguts 
• necessitats de programació 
• ...

5-Guió gràfic, llibre d’estil. 
Es defineixen els elements gràfics que permetran transmetre el missatge al públic adequat amb el to desitjat:

• colors 
• tipografies 
• tipus d’imatges 
• tipus d’il·lustracions 
• com s’indicaran els elements de navegació 
• necessitats iconogràfiques

Exercici:
VISITA L'EXPOSICIÓ EFECTE SOUVENIR I DIBUIXA EL MAPA DE NAVEGACIÓ DE L'APLICACIÓ INTERACTIVA QUE ACOMPANYA L'EXPOSICIÓ.

 -PER DIJOUS 4 DE NOVEMBRE: Escriu al teu blog un post amb el guió literari de l'aplicació (descriu l'aplicació de forma sencilla, sense tecnicisme, explicant què pot fer l'usuari).

-PER DIJOUS 11 DE NOVEMBRE: Amb l'ajuda de photoshop, dibuixa el mapa de navegació de l'aplicació i penja'l al teu blog.

Dhub 
Sala Montcada
c/ Montcada, 12
08003 Barcelona
Tel. 93 256 23 00
dhub@bcn.cat
+ informació: http://www.dhub-bcn.cat/ca/info
 

Fases d'un projecte multimèdia. Pre-producció. Planificació II (el disseny de producció)

Determinar l’equip humà necessari:

Per la coordinació: 

• Productor executiu: Qui inicia el projecte. És el responsable de l'administracio i gestió de tot l'equip humà que desenvoluparà l'aplicació. També és el responsable de mantenir el contacte amb el client i el director comercial encarregat de la campanya. Es responsabilitzarà dels contractes i de les gestions de drets. Perfil tipus: persona amb experiència en el treball en equip. Capacitat d'organitzar i manar. Coneixement de tots els processos que tindran lloc en l'elaboració del projecte.  Perfil acadèmic: empresarials, informàtica, enginyeria.
  
• Project manager: Qui s’assegura que el projecte es porta a terme. Acostuma a només treballar en un projecte al mateix temps. Procurarà un equilibri entre els membres de l'equip i en facilitarà la comunicació. Perfil tipus: Experiència en el treball en equip.  Capacitat per organitzar i manar. Coneixement directe dels membres de l'equip. Coneixement del mitjà i els processos. Perfil acadèmic: Empresarials, relacions públiques, publicitat, informàtica, enginyeria, comunicació audiovisual.
  
• Director creatiu: Defineix el tractament formal del producte i s’assegura de la  unitat de tots els elements del projecte. Haurà de conèixer bé el mitjà digital. Determinarà, per exemple, el tipus de botons, cursors, tipus de transicions, distribució dels elements,... Perfil tipus: Experiència en el treball en equip. Creatiu. Capacitat de gestionar equips. Coneixement del software gràfic i d'autor. Coneixement del mitjà.   Perfil acadèmic: disseny gràfic, belles arts, publicitat, comunicació audiovisual.

Per el disseny visual:

• disenyadors gràfics: Domina les eines d’edició gràfiques i crea el material visual d’acord a les directrius del director creatiu.
• animador: Expert en la generació d’animacions (3D o 2D), manuals o informàtiques.
• cineasta: Expert en l’ús d’equips de video i cinema. Pot treballar amb un equip al seu càrrec (càmeres, editors,...) o assumir tot l’encàrrec.
• fotògraf: Captarà i crearà imatges fotogràfiques i les digitalitzarà i tractarà.

Per la comunicació:

• Guionista: Expert en redactar i comunicar idees de forma escrita.Es documentarà amb la informació necessària per el projecte. Perfil tipus: Creatiu. Experiència en treball en equip. Coneixement del mitjà. Experiència en proves i evaluació de resultats. Perfil acadèmic: documentació, periodisme, comunicació audiovisual, filologia.
• Dissenyador multimèdia: Coneix el mitjà i els mètodes i tècniques que caldrà implementar. Enten el llenguatge no lineal i pot definir un sistema de navegació per la informació. Determinarà l'estructura de la navegació i els enllaços del projecte. És el responsable de la interactivitat. Perfil tipus: Experiència en el treball en equip. Creativitat. Coneixement profund del mitjà. Experiència en la prova i evaluació de resultats. Perfil acadèmic: documentació, periodisme, comunicació audiovisual, disseny gràfic

Per la programació

• Programador. Perfil tipus: Experiència en el treball en equip. Resolutiu (capaç de reaccionar davant d'imprevistos amb solucions ràpides i efecties. Coneixements de software i de llenguatges de programació. Coneixement de les possibilitats tècniques del mitjà i del mercat. Perfil acadèmic: Informàtica, programació, enginyeria.
  

Per el so:

• Compositor musical: serà ideal que conegui el mitjà informàtic i les seves possiblitats
• Tècnic de so: Produeix el so.
• Supervisor d’àudio: s’assegura que la música i la veu s’adapten a l’estil definit pel director creatiu.

Per la gestió comercial:

• Departament comercial: Grup que s'encarregarà de la venta, difusió, publiciat i distribució de l'aplicació. Perfil acadèmic: empresarials, relacions públiques i publicitat.
  

 Altres:

• col·laboradors (maquilladors, atrezzistes, dobladors, músics...)     
  

Com a característiques comuns, tot l'equip haurà de ser capaç d'adaptar-se als plaços d'entrega. Per això serà necessari que conegui les seves limitacions.              

Determinar les gestions necessàries:                       

• Drets d’autor del material extern usat.
• Drets d’autor de l’obra resultant
• Normes i lleis aplicables
• Dipòsits legals.

Determinar els recursos materials necessaris:

• Instal·lacions
• Eines informàtiques (software i hardware)

Preveure l’agenda del projecte:

• dates d’inici, finalització i diferentes fites a assolir.

Preveure possibles marges d’error

Preveure el cost aproximat del projecte i, si escau, de manteniment:

• Pressupost màxim total
• Solvència econòmica
• Cost de manteniment i reparacions possibles.

Fases d'un projecte multimèdia. Pre-producció. Planificació

Un projecte multimèdia, com tot procés creatiu, busca respondre a un problema. L’èxit del projecte dependrà de plantejar correctament quin és el problema que es vol resoldre. Aquesta és la primera tasca de tot project: planificar.


La planificació consta de 3 fases inicials:

• Identificar els condicionants bàsics
• Seleccionar la informació a transmetre
• Decidir el suport informàtic de l'aplicació.

Això permetrà:

• Determinar l'equip humà
• Determinar les gestions necessàries
• Determinar els recursos materials necessaris
• Preveure l’agenda del projecte
• Preveure possibles marges d’error
• Preveure el cost del projecte i, si escau, de manteniment
  

Els blocs...

Durant el curs Realització Multimèdia, cada alumne mantindrà un blog personal de treball. Aquí teniu el llistat de blogs creats.

Fases d'un projecte multimèdia. La pre-producció.

Com qualsevol producte audiovisual, un projecte multimèdia necessita de diferents fases de producció. Podríem dividir-les en:

• PRE-PRODUCCIÓ
• PRODUCCIÓ
• POST-PRODUCCIÓ

La pre-producció és la part més important de qualsevol projecte audiovisual. És la part de la feina que es desenvolupa sobre paper.
Podem dividir la pre-producció en :

• planificació
• guionatge
• disseny de prototips i proves
  

A http://www.mixpod.com podeu trobar reproductors de música com aquest.

Consulteu el llistat d'enllaços en aquest bloc per més recursos.

La web 2.0

Podríem dividir la evolució d'internet en 2 fases: web 1.0 i web 2.0.

A l'etapa web 1.0 es van crear milers de pàgines web basades en el llenguatge d'etiquetes HTML. Es tractava de pàgines estàtiques que, un cop creades, poques vegades eren actualitzades. Per crear aquestes pàgines calia comptar amb ajuda d'especialistes, persones capaces de crear els codis necessaris.

En aquesta fase van aparéixer poc a poc serveis que permetien a l'usuari fer servir internet per transmetre informació més fàcilment, però la participació del públic en la creació de continguts només era visible als fòrums.

La segona etapa va ser definida per primera vegada el 2004. Va ser aleshores quan la web es va omplir de pàgines que més que informació oferien serveis, permetent que la gent es comuniqués i compartís coneixements sense haver de ser un expert en la matèria.

Vannevar Bush

El 1945 Vannevar Bush, científic nord-americà, va tenir una gran idea..

Com altres científics de la seva època, sentia que la ciència ja portava prou anys treballant al servei de la guerra. Ara calia concentrar-se en donar alguna cosa de profit a la societat. Va pensar que en temps de pau la tècnica s'havia de posar al servei de la cultura.

Un tema que el preocupava era la gran quantitat d'informació que hi havia al món i la dificultat per accedir-hi. Calia, va pensar, un nou sistema d'emmagatzemar informació i una nova manera de recuperar-la. I amb totes aquestes ideas va crear un article amb el títol de "As we may think" ("com podríem pensar").

Les llicències d'ús de continguts i bancs d'imatge

Una llicència és l'autorització o permís concedit per l'autor per fer ús de la seva obra de forma convinguda, amb uns límits i drets en el seu ús. Una llicència delimita, per exemple, el territori on es pot fer servir un contingut, el temps durant el qual es pot difondre o qualsevol altra clàusula que l'autor o el gestor dels seus drets pugui incloure.

Interficies interactives i ús de sensors

El multimèdia és una disciplina que requereix creativitat, capacitat d'organització, coneixement de software i coneixement de hardware.

Conèixer el hardware significa conèixer els equips amb els que podem treballar, els diferents soports de distribució, les característiques dels mitjans i els diferents dispositius d'entrada de dades i de sortida.

Els dispositius d'entrada ens permeten comunicar a l'equip què volem: quina informació volem consultar i quan. Són dispositius d'entrada el ratolí, el teclat o una pantalla tàctil. També, però, hi ha altres dispositius d'entrada com són el micròfon, una càmera digital o els sensors.

Micròfons, càmeres i sensors ens permeten una interactivitat diferents amb la màquina, perque ens permeten fer servir la veu o el moviment del nostre cos per interactuar. En aquests casos, micròfons i càmeres es fan servir com a sensors.