Hvordan lage GUI i Visio

Microsoft Visio 2010 er et grafisk design verktøy som kan brukes til å lage diagrammer, grensesnittelementer, navigasjon menyer og andre visuelle objekter. Den tilbyr et bredt utvalg av verktøy for å lage design av et grafisk brukergrensesnitt (GUI). Diagrammet viser hvordan programmet eller Web-grensesnittet vil vises i sin endelige form. Utvikling av en GUI i Visio er ikke så vanskelig, og design kan eksporteres som PDF-filer. Følg noen retningslinjer for å lære å bygge en grunnleggende GUI wire-frame mockup for et nettsted.

Bruksanvisning

1 Åpne Microsoft Visio. Opprett en ny tegning ved å klikke på blank tegning ikonet. Klikk på "Create" -knappen.

2 Klikk Figurer vinduet på venstre side av skjermen. Velg "Flere figurer." Velg "Basic Shapes amerikanske enheter." Klikk "Hurtig Shapes".

3 Lag en overskrift boks ved å høyreklikke på rektangel boks form og dra form til tegneområdet. Endre størrelsen på boksen for å dekke om lag 15 prosent av det øverste området av tegningen.

4 Opprett en navigasjonsmeny boks ved å høyreklikke på rektangel boks form og dra formen under motorkassen. Endre størrelsen på boksen for å ha en høyde på ca en halv tomme og samme bredde som motorkassen.

5 Lag en stor hoveddel boks ved å høyreklikke på rektangel boks form og dra den under navigasjonsmenyen boksen. Endre størrelsen på boksen for å ha samme bredde som header og navigasjonsmenybokser og til å dekke bunnen av tegneområdet.

6 Lag to rektangel bokser ved å høyreklikke på rektangel boks form og dra formen over til tegneområdet to ganger. Resize hver boks for å passe den ene halvdelen av hoveddelen boksen. Bevege hver boks for å passe ved siden av hverandre inne i hovedlegemet boksen.

7 Lag tekstfelt som representerer navigasjonskoblinger ved å klikke på "A Text" -knappen øverst på navigasjonslinjen. Velg et område inne i navigasjonsfeltet for å lage et lite tekstfelt ved å klikke på venstre museknapp. Flytt musen for å endre størrelsen på feltet til ønsket lengde. Skriv inn tekst for å si "Home".

8 Lag fire tekstfelt ved hjelp av venstre museknapp. Skriv inn "menyen" i hver boks. Resize hver boks for å matche størrelsen på "Home" boksen.

9 Velg et område innenfor hovedmotorkassen og lage et tekstfelt med beskrivelsen "Hoved Header".

10 Lag en tekstboks inne i hver boks plassert inne i hovedinnholdet boksen område av tegningen. Gi hver tekstboks en beskrivelse, for eksempel "Content-området." Endre størrelsen på hver tekstboksen for å være av samme størrelse. Velg "Pointer" -knappen på toppen navigasjonsmenyen.

11 Lagre tegningen ved å klikke på "File" fra toppen navigasjonsmenyen og velge "Lagre som".

Hint

• Mens Visio ikke kommer med GUI prototype sjablonger eller gjenstander, trenger tredjeparts selskaper tilbyr slike verktøy for nedlasting. Hvis du har tenkt å bruke Visio for å lage en samarbeids design, må du huske på at Visio-tegning filformatet er ikke kompatibel med de fleste tegning programvarepakker.
• Altfor kompliserte tegninger kan forårsake Visio å bremse ned i forfriskende en tegning etter å gjøre en endring.