Oblig.08 – Ferdig

Idag er innleveringsdagen for obligatorisk oppgave 08 – Flash. Igår klarte jeg heldigvis og ordne opp i problemene som oppsto ved integrering av fotogalleri og banner til mitt enkle nettsted. Jeg fryktet det kom til å bli vanskelig, og det var akkurat det som skjedde.

Først gikk jeg igjennom fotogalleriet; sjekket at alt var på plass og slik jeg ønsket. Deretter eksporterte jeg FLA filen til en SWF fil, altså en komprimert fil. Lagret denne filen i samme mappe som banneret. Jeg åpnet banneret i Flash, sjekket at animasjonen fortsatt fungerte og at alt var på plass. Deretter åpnet jeg Action Script vinduet og kodet riktig URL i parentesene, slik som vist under.

Jeg eksporterte denne til en SWF fil, og lagret i samme mappe som galleriet. Videre åpnet jeg Adobe Dreamweaver, index siden. Her importerte jeg banneret og la den inn nederst på siden. Jeg hadde allerede lagt til fotogalleriet i en egen Flash mappe, så denne var det bare å laste opp. Etter en del forsøk på å teste ut resultatet på mitt enkle nettsted, kom denne meldingen opp ved å klikke på banneret:

Noe var altså feil i kodingen til banneret eller plasseringen i mappene. Jeg prøvde meg frem; forandret kodingen, forandret mappeplassering, forandret filnavn etc. Den samme meldingen kom fortsatt opp. Etter mange timer begynte jeg å bli veldig frustrert, og da jeg spurte om hjelp på forumet til Noroff følte jeg meg både dum og fortvilet når jeg ikke skjønte forslagene de kom med. Uansett, etter mye fortvilelse greide jeg det tilslutt. Jeg lagret banneret som SWF på nytt, med et annet filnavn, la det til i Dreamweaver med en annen tittel, og lastet opp på nytt. Problemet var mest sannsynlig at filnavn og tittel var det samme, når jeg forandret dette var problemet løst.

Nå håper jeg virkelig at alt fungerer slik jeg ønsker, og at det fungerer likt på alle maskiner. For å komme til hovedsiden på mitt enkle nettsted hvor banneret er plassert, klikk her.

Banneret ser slik ut, og er allerede halvveis i animasjonen i denne printscreenen. Jeg har lagt til en svart ramme på banneret og sidene i fotogalleriet, for å skille de fra nettstedet og for å skape en bedre helhet i designet.

For å komme direkte til Flash fotogalleri, bruk denne linken, her.

Først kommer du til hovedside 1, som viser forsiden til fotoessayet og galleriet med fotografi, tittel og rammer. Deretter kommer du til hovedside 2, som viser titler til hvert bilde, samt tittel med tekst til fotogalleriet. Jeg håper teksten er med på å veilede brukeren til å forstå hva de ulike knappenes funksjon er. Dette er noe jeg har brukt mye tid på å få til, og for å forstå hvordan det fungerer anbefaler jeg å sjekke det ut. Fra denne siden kommer brukeren til selve galleriet, hvor knapper blir brukt for å ta brukeren tilbake eller videre i fremvisningen, eller tilbake til hovedside 2.

En annen viktig ting til denne oppgaven er rapporten, som teller 20%. Jeg legger mye arbeid i rapporten, det er veldig viktig for meg at denne fremstår profesjonelt og at den reflekterer min prosess og arbeidsmetode, samt idé og utvikling. Her kan jeg bruke litteratur og leksjoner fra Noroff som kilder, og begrunne mine valg. Hva har jeg lært? Hvordan har jeg lært det? Hvorfor? Hva har jeg gjort og hvordan?

Dette er noe jeg prøver å svare på i rapporten. I rapporten følger jeg et oppsett gitt av Noroff, hvor det starter med en innledningsdel, deretter en del om research og arbeidsprosess, videre en del om designvalg, så en del med egenevaluering og konklusjon, og tilslutt kildehenvisning og referanser. For de som ønsker å lese rapporten, totalt 10 sider, bruk linken under.

Rapport Oblig.8

– Annette B. D.

Oblig.08 – Banner prosess

Nå begynner banneren, som skal reklamere for fotogalleriet, å bli ferdig. To dager før innlevering gjenstår det å gå igjennom Flash arbeidene mine, ferdigstille rapporten og få integrert banneren på mitt enkle nettsted, samt laste opp fotogalleriet. Jeg er veldig spent på om jeg klarer å få til dette på første eller andre forsøk, og gleder meg til å få alt på plass, samt vise dere hva jeg har jobbet med i 5 uker.

Banneren skal inneholde en enkel animasjon. Jeg har valgt å lage en animasjon av en bukse/jeans som blir brettet, og har jobbet med fire hovedstadier i animasjonen. Disse tegningene har jeg tatt prinscreens av, så dere kan se hvordan buksen ser ut i de ulike stegene. Først en tegning av en jeans i full lengde og bredde, bakfra. Deretter en tegning av en jeans som er brettet til den ene siden, hvor det andre «beinet» ligger bak. Videre en tegning i prosessen som viser hvordan buksen ser ut idet den blir foldet en gang. Den siste tegningen viser hvordan en jeans ser ut når den er ferdig brettet, kompakt og plassbesparende.

 

Jeg har brukt veldig lang tid på å utvikle disse fire stadiene i animasjonen, og det har vært svært krevende å bruke Adobe Flash sine tegneverktøy. Jeg har allerde gjort noen forandringer til tegningene for å forenkle de enda mer. Etter mye jobbing med å tegne og finpusse på buksene har jeg laget et movie clip. Jeg har brukt en blå farge i stroke for å illustrere hvilken farge jeansen har. Jeg startet med å velge Create Shape Tween mellom de fire tegningene, og laget en animasjon på tilsammen 10 sek. Videre jobbet jeg med plassering av shape hints, altså hint man kan legge til for å få mer kontroll over animasjonen. Problemet mitt var at mellomposisjonene fra det ene stadiet til det andre ble helt feil, og absolutt ikke slik jeg hadde tenkt det. Jeg prøvde videre, og jobbet svært lenge med å få tweeningen slik jeg ønsket. Resultatet ble greit nok for å være nybegynner, men jeg følte meg veldig usikker på om dette kom til å bli godkjent.

Min eneste mulighet for å rette opp i animasjonen var rett og slett å starte på nytt, men jeg hadde fortsatt mine fire stadier å arbeide etter. Jeg opprettet et movie clip, startet med det første stadiet, og forandret tegningen i hver enkelt ramme. Deretter fortsatte jeg med å legge inn 2 sek pause, for deretter å jobbe videre med det andre stadiet, samt gradvis forandre tegningen. Arbeidet fortsatte med pause, steg 3, lage forandringer i 24 frames, pause, steg 4, pause. Animasjonen min ble 10 sek denne gangen også, men selve animasjonene kun 1 sek hver, med 2 sek pause/hold. Jeg har jobbet utrolig presist og vært nøyaktig med plassering, samt hvordan jeg har laget animasjonen. Mye tid er blitt brukt til å gå gjennom og rette opp animasjonen, og jeg føler selv jeg er mer tilfredsstillt ved dette resultatet.

På scenen skrev jeg inn tekst som skal brukes på banneren, og la til jeans animasjonen min. Måtte jobbe nøyaktig med plassering her også, og hvordan de ulike elementene skulle stå i forhold til hverandre. Tilslutt la jeg til en effekt på fotoessayets tittel for å få banneren mer interessant, en Clockwise rotasjon, som skal gjenta seg 2 ganger i sekundet. Utfordringen var å få dette til å stoppe akkurat i det animasjonen starter.

Jeg har valgt å benytte de samme fargene på animasjon og tekst som i fotogalleriet, for å skape en helhet og følelse av at alt henger sammen. For å få banneren til å fungere som en knapp/peker har jeg opprettet et button symbol og laget en knapp som er like stor som banneren, altså 640 px x 320 px. Knappen er usynlig og har kun innhold på Hit- stadiet. Fra banneren skal brukeren kunne trykke og komme direkte til fotogalleriet. Se printscreen under for hvordan banneren ser ut i scenen, det lyse blå laget illustrerer knappen.

– Annette B. D.