BONES FESTES

Passos que s'han de fer per allotjar un lloc web

  1. Primer demanar domini amb una empresa que registri: Nominalia, CDMON.
  2. Demanar hosting a una empresa allotjadora. Sync.es per exemple, dient-li el domini que farerm servir.
  3. Passar les DNS del hosting a la empresa registradora.

Etapes d'un projecte

  1. Esquema de la informació. Fer un esquema d'arbre amb les seccions, les subseccions, les sub-subseccions,...
  2. Diagrama de flux de la navegació. Fins on puc anar des de cada secció.
  3. Plantejament d'interfície tenint en compte els dos passos anteriors.
  4. Estudi de la usabilitat. Analitzar si satisfem les 3 necessitats bàsiques que té tot usuari: saber on es troba, saber què pot fer i saber què hi ha.
  5. Estudi de la comunicació visual. A quí ens dirigim, com transmetem el missatge visual,...
  6. Adquisició i producció de material gràfic i texts que farem servir.
  7. Confecció del Layout de la pàgina maestra d'acord amb els passos anteriors.
  8. Producció de totes les pàgines i enllaçat.
  9. Control de qualitat. Comprovació d'errors, que tots els enllaços funcionin,...
  10. $
  11. Pujar la pàgina al servidor.

ACTIONSCRIPT3 - PROJECTE CUB

Per entendre les 3D del FLASH(que en realitat són 2.5D ja que no em consta que hi hagi volums encara) us estic preparant un tutorial que abordarà el tema des de dos punts de vista. El d'animació i el de programació. La excusa per fer això és intentar fer un cub. a base de 6 cares quadrades.

Si algú s'ho vól plantejar com a repte ho pot començar a fer.

Nota: Corretgits alguns errors d'ilustracions

Les animacions que no es veien bé a la part d'Autoedició>Flash s'han corretgit. M'estic referint per exemple als articles que es parlava dels anidaments de símbols, les interpolacions de moviment i les interpolacions de forma. Cal que corretgeixi també algun error ortogràfic com per exemple excés de "elas geminades" i també la maquetació ja que amb la nova plantilla que vaig aplicar al blog que pretenia donar més amplitud ha fet que les maquetacions dels articles s'hagin desquadrat una mica. A poc que pugui les aniré corretgint.

AS3 - ActionScript 3 - PRELOADERS - Videotutorial de Batatastudio

De la mà de Batatastudio ens arriba aquest videotutorial sobre com fer un preloader en ActionScript amb AS3.




Us recomano que llegiu el seu canal per anar posant-vos al dia a les noves versions de Flash. Clica aquí.

Action Script 3 - Obligats a re-aprendre Action Script

Al món d'Internet cal actualitzar-se contínuament. I generalment ens serveix tot el que haguem après anteriorment. Hi ha una regla tàcita als llenguatges d'Internet, que gestiona el W3C, que consisteix en que tot el que valia anteriorment ha de valer en versions posteriors d'aquell llenguatge. Si hem invertit temps, diners i esforç en aprendre un llenguatge com a mínim ens serveix per un temps determinat i només cal que ens anem actualitzant de tant en tant.


Però no és el cas del Flash. Tal i com va succeïr amb la transició d'ActionScript1 cap a ActionScript2 novament hi ha ruptura traumàtica. El que valia a al AS1 no va valer al AS2. I tampoc no tot el que va valer al AS2 valdrà al AS3. Cal pensar que Action Script no és un llenguatge obert. És un llenguatge propietari i com a tal està a mercé de la voluntat dels seus propietaris que tenen un afany legítim comercial. Tot llenguatge propietari implica que hi ha poca comunitat de gent desenvolupant-lo, per tal de repartir els diners entre menys, i fa que es pensi més a poc a poc en el seu desenvolupament. Amb plaços d'entrega forçats per vendre les noves versions de flash es va avançant a cops. Es fan millores sí. Però amb canvis molt radicals. És per això que hi ha una tendència darrerament a marxar cap al AJAX amb frameworks com Script.Aculo.Us, JQuery, Mootols, que permeten fer coses similars a les que ja feiem amb Flash, en quant a interactivitat, però amb les bondats de ser més permeables a la indexació de Google, i per altra banda permetent actualitzacions de continguts més àgils. Les principals marques ja no fan les webs exclusívament en Flash. Ajax(o el que és el mateix Javascript i més coses) cada dia s'imposa més. Si no mireu la pàgina de Coca Cola.

Un dissenyador híbrid, com ho som molts, està disposat a introduir-se en el món de la programació orientada a objectes fins a cert punt. I en qualsevol cas cal que es vagi actualitzant de mica en mica. I aquests canvis tant radicals, la veritat, no són massa populars. Els de Adobe són conscients de que això no desperta masses simpaties i estàn preparant un programa que es diu Flash Catalyst que permetrà dissenyar interfícies webs interactives sense tocar gens el codi. Bé, aquesta és la idea que volen vendre. Però això en cas que sigui cert, com ha passat amb altres falàcies comercials, tornarà més inútils encara als dissenyadors de ment estreta que es conformaven amb el que es pot aconseguir únicament amb el Dreamweaver.

Com en tot cal que hi hagi un equilibri. A veure si a partir d'ara fan evolucionar el ActionScript d'una manera una mica més racional, sense ruptures dràstiques. Comencem a estar farts de tenir que aprendre ActionScript des de cero cada vegada que decideixen tocar-lo.

Us aniré posant enllaços d'adaptació per pasar-vos al AS3.

ACTION SCRIPT - Guía d'introducció ràpida

Coses que s'han de saber sobre ActionScript:

  1. ActionScript és un llenguatge de programació orientat a objectes[POO].
  2. És el llenguatge que ens serveix per programar interactivitat dins del flash. La interactivitat és la activitat que es produeix quan un programa o màquina reacciona davant d'un estímul nostre.
  3. La interactivitat que podem definir amb ActionScript amb el flash succeeix al costat client(navegador).
  4. Per posar accions ens cal fer servir la finestra "Acciones". Per treure-la podem anar al menú Ventana > Acciones. Això ens mostra la finestra "Acciones", la qual conté al costat esquerre una col·lecció d'accions distribuïts en llibres i subllibres.
  5. Quan vulguem posar una acció d'ActionScript ho podem fer escrivint o fent doble click sobre l'acció que veiem al costat esquerre de la finestra Acciones.
  6. Amb la finestra Acciones podem treballar en Mode Expert o amb l'Assistent d'Script.
  7. Si treballem amb l'Asssistent d'Script premut ens apareixen camps per farcir amb paràmetres. L'assistent d'Script ens ajudarà fins que sapiguem la sintàxi del llenguatge ActionScript. Però quan ens limiti per treballar és millor sortir d'aquest mode de treball.
  8. Podem posar accions d'ActionScript[A l'ActionScript 2.0] a tres llocs possibles: Clips de pel·lícula, botons i fotogrames.
  9. Abans de posar accions a un fotograma ens cal seleccionar el fotograma.
  10. Abans de posar accions a un clip de pel·lícula ens cal seleccionar el clip de pel·lícula.[No ho hem fet, no ens donarà temps probablement].
  11. Abans de posar una acció a un botó cal seleccionar el botó.
  12. Quan vulguem posar una acció a un botó cal fer servir la sintaxi:
    on (release) {
    accions; }

    Entre els parèntesi posem "events de ratolí"(maneres d'activar el botó. Com a valors possibles tenim: press, release, releaseOutside, rollOver, rollOut,...). Entre les claus posem accions. Entre les claus podem posar tantes accions com calgui.
  13. A vegades ens cal aplicar accions que fan referència a instàncies concretes, així que el primer que necessiten aquestes instàncies és tenir nom.
  14. Els clips de pel·lícula ens donen la opció de posar-los un nom d'instància mentre que els símbols gràfics no.
  15. Quan vulguem aplicar una acció a una instància en concret que té nom cal que enrutem correctament fins arribar a la instància desitjada. Per això ens cal conèixer una mica d ela terminologia de prefixes:
    a. this [Per referir-nos a la línia de temps en la que ens trobem]
    b . _root [per referir-nos a la línia de temps principal]
    c. _parent [per referir-nos a la línia de temps que hi ha per sobre.]

FLASH -VIDEOTUTORIAL - ANIMACIÓ PERSONATGES

Els de conecta tutoriales tenen aquest vídeo interessant sobre animació de personatges al youtube.

Humor - "Me siento GIF"

Disseny - Accessibilitat (Juglar)

Juglar ens posa una llista de webs on podem trobar informació sobre Accessibilitat. Clica aquí.

Anieto2k ens explica 5 exemples en que el disseny pot millorar l'accessibilitat d'un lloc web

Doneu-li un cop d'ull en aquest enllaç. Clica aquí.

Programació - Jquery

JQuery és una de les famoses llibreries de Javascript que s'han posat de moda els darreríssims anys, com la llibreria Script.Aculo.Us o Mootools. Aquestes llibreries són un conjunt de funcions prefabricades i reutilitzables que ens permeten controlar millor el DOM d'objectes d'un document i la seva interactivitat. No és en sí un llenguatge de base (el llenguatge de base és el javascript) si no una mena de meta-llenguatge per controlar al javascript d'una manera una mica més còmode, tot i que al començament costa d'entendre. La seva corva d'aprenentatge és dura al començament. Per poder treure-li el màxim profit a aquestes llibreries cal controlar molt bé el CSS i conèixer suficientment el javascript.


JQuery per principiants.(anglès)

En anglès un videotutorial per principiants sobre la llibreria Jquery.




Smooth scrolling. (Italiano).

Photoshop - Videotutoriales - Blanquejar dents

Ivanciko ens brinda al seu canal de youtube aquest altre videotutorial en que ens explica com blanquejar dents d'una fotografia. Això ho farà de forma molt senzilla amb màscara ràpida per seleccionar només les dents i canviarà la coloració de les dents amb Tono-Saturación(Imagen>Ajustes>Tono-Saturación).



Us poso l'enllaç al seu canal de youtube per si us voleu suscriure. Val la pena.

Photoshop - Videotutoriales - Treure ulleres

En aquest videotutorial de "ivanciko" ens explica com corregir ulleres, granets, d'un retrat.

És un interessant exemple d'ús d'eines que hem fet servir al curs de photoshop però de forma combinada. Les eines i tècniques que fa servir són: sobre-exposar, dit de desenfocar, pincell corrector, seleccionar, desenfoque gausiano, mode de fussió "luz suave",

Photoshop - Videotutoriales - Retoc de retrat

He trobat un videotutorial al youtube molt interessant fet per Conecta Tutoriales en el que es combinen diverses tècniques de selecció, modes de fussió, màscara ràpida, canals, filtre liqüar... coses bàsiques que haureu fet amb mí els alumnes de photoshop però que aquí les expliquen ja de forma combinada.

Blog arreglat!!!!

Blog arreglat!!!!

;)

Ajax - Shadowbox - Interessant clon de Lightbox

http://www.shadowbox-js.com/

És interessant aquest clon de lightbox que a més admet flash i video.

Doneu-li un cop d'ull.

DW - Com penjar la web? - Configurar el client FTP del DW

Voleu penjar la web, oi? Cap problema.

Ja heu acabat la web i la voleu pujar al vostre hosting. Doncs si feu servir el DW us explicaré de quina manera en un tutorial pautat explicat pas a pas.

Tan sols heu de configurar el gestor d'arxius i client FTP del DW seguint els passos que us indicaré. Clica aquí per anar directe a aquest tutorial pautat de DW que es troba dins de la secció d'autoedició.

Si no fèssiu servir el client FTP del DW podeu fer servir el Filezilla-FTP-Client en un procés similar. Només haureu de definir l'adreça del servidor FTP, un nom d'usuari i un password. Però un Filezilla-FTP-Client no gaudeix de les mateixes comoditats que té el client integrat d'FTP del DW.

DW - Comportaments - Menús emergents



A la secció d'Autoedició us poso un tutorial per fer Menús emergents aprofitant-nos de la col·lecció de javascripts que incorpora DW. Clica aquí per anar al tutorial. I clica aquí per anar a veure la pàgina avia2.html on es troba l'exemple real.