Du trenger ikke å være ekspert i Flash for å lage prototyper . Programmets fleksibilitet gjør prototyping med begrenset kunnskap om ActionScript 3 . Rapid prototyping hjelper brukerne visualisere det endelige produktet . Flash lar deg lage prototyper av varierende fidelity ( hvor nært prototypen ligner det endelige produktet ) , noe som gjør det enkelt å oppdatere interaktive lag og designkonsepter fra enkle wireframes til detaljerte ferdige design . Instruksjoner
Forberedelse
en
Lag bilder som representerer de nødvendige skjermer og stater , ved hjelp av programvare som Fireworks , Photoshop eller Corel . Kvaliteten til bildene kan være alt fra wireframe til visuelle design ( se Referanse 2 ) .
2
Åpen Flash og klikk på "File ", deretter "New" og deretter " Flash File ( ActionScript 3.0) "i menyen som åpnes. Klikk på " Window" i hovedmenyen , og klikk "Egenskaper" og deretter "Egenskaper " igjen i den uttrekkbare menyen. Type " 1024px " i " W" -feltet og " 768px " i " H "-feltet .
3
Lagre filen ved å klikke på "File " på hovedmenyen , og deretter klikke på " Lagre som ", skrive inn et navn (for eksempel" proto ") og deretter klikke på" Lagre ".
4
Import bildene dine ved å klikke på " File "og deretter klikke på" Import "og deretter klikke på" importere til biblioteket . " Bla til der bildene blir deretter klikker du "Open ". Hvis bildene er i rekkefølge , vil Flash automatisk importere dem som etterfølgende keyframes i det valgte laget , ellers må du legge nøkkelbilder ved å høyreklikke på rammen , og deretter klikke på " Sett Nøkkelbildekontroll " i uttrekkbar meny for hver image ( se Reference 3 ) .
5
Navn laget "Wire " ved å dobbeltklikke på " Layer 1 " og trykke "Enter " på tastaturet . Legg keyframes mellom bilder på tidslinjen ved å klikke på første keyframe og trykke "F5 " på tastaturet fire ganger ( se Referanse 2 ) .
6
gi bildet rammer navn ved å klikke på "Window " i hovedmenyen , og deretter klikke på "Egenskaper" og deretter klikke på "Egenskaper" igjen i den uttrekkbare menyen. Med ett bilde ramme uthevet , skriv bilde- navnet i "Frame Label" -feltet. Gjenta denne prosessen til de andre bildene ( se Referanse 2 ) .
7
Lag et nytt lag ved å klikke på "Insert Layer " nederst i tidslinjen og navngi den " AS3 . " Høyreklikk på Frame en av " AS3 " lag , og klikk " handling" i den uttrekkbare menyen. Skriv inn følgende kode :
stop ();
( . Se Referanse 2 )
Button
8
Double- klikk " Fill Color " på verktøylinjen , og klikk " Ingen" på fargen (det vil bli boksen med en diagonal rød linje) . Dobbeltklikk på " Stroke Color " i verktøylinjen og angi en verdi av " 3 " for " Stroke Høyde ", deretter hvilken som helst farge ( se Referanse 2 ) .
9
Klikk på " rektangel "-verktøyet på verktøylinjen, og mens du holder nede musen , drar over scenen for å tegne et rektangel . Rektangelet bør være en passende størrelse for klikkbare områder . Klikk på " rektangel "-verktøyet, deretter i hovedmenyen klikker " Endre ", deretter "Konverter til New Symbol" i den uttrekkbare menyen. Klikk på " Button" radial boksen og skriv inn " Button_btn " etter navnet ( se Referanse 2 ) .
10
Dobbeltklikk på knappen for å gå inn i tidslinjen. Høyreklikk på rammen merket " Hit ", og velg " Sett Nøkkelbildekontroll . " Endre fargen på knappen. Gjør det samme for " Over ". Slett fargen for " Up ". Dette vil gi deg en usynlig knapp som vil bli markert når brukeren mus over det. Klikk på " Scene 1" på bunnen av tidslinjen for å avslutte knappen tidslinje . Slett knappen fra scenen ( se Referanse 2 ) .
11
Lag et nytt lag ved å klikke på "Insert Layer " nederst i tidslinjen , og navngi det nye laget " knapper ". Sett keyframes i " Knapper " lag på samme rammenumrene som bildene i "Wire " lag (se Referanse 2 ) .
12
Dra en " Button" fra biblioteket og legg den på scenen . Klikk på " Window" i hovedmenyen , og klikk "Egenskaper" og deretter "Egenskaper " igjen i den uttrekkbare menyen. Med knappen fortsatt markert , angir du et unikt eksempel navn, for eksempel navnet på siden det vil navigere til , for eksempel " page1_btn " ( se Referanse 2 ) .
13
Høyreklikk Frame 1 av " AS3 " lag , og klikk " handling" i den uttrekkbare menyen. Skriv inn følgende kode , erstatte " side1 " for frame label navn
page1_btn.addEventListener ( MouseEvent.CLICK , onPage1 , falske, 0 , true);
funksjon onPage1 ( evt : MouseEvent ) : . void {
gotoAndStop ( " side1 ");
}
14
Gjenta prosessen for andre sider