Come creare una GUI in Visio
Microsoft Visio 2010 è uno strumento di progettazione grafica per creare diagrammi, elementi interfaccia, menu navigazione e altri oggetti visivi. Offre vasta gamma di strumenti per progettare una GUI (Graphical User Interface). Il diagramma mostra come apparirà l'applicazione o interfaccia Web nella forma finale. Sviluppare una GUI in Visio non è difficile, i design si esportano come PDF. Seguire linee guida per creare un wireframe mockup base per un sito web.
Passo 1
Aprire Microsoft Visio. Creare nuovo disegno cliccando icona disegno vuoto. Cliccare "Crea".
Passo 2
Cliccare finestra "Forme" a sinistra. Selezionare "Altre forme". Selezionare "Forme base unità USA". Cliccare "Forme rapide".
Passo 3
Creare casella intestazione: tasto destro su forma rettangolo, trascinare in area disegno. Ridimensionare per coprire ~15% area superiore.
Passo 4
Creare casella menu navigazione: tasto destro su rettangolo, trascinare sotto intestazione. Ridimensionare altezza ~1,27 cm e stessa larghezza intestazione.
Passo 5
Creare grande casella corpo principale: tasto destro su rettangolo, trascinare sotto menu navigazione. Ridimensionare stessa larghezza intestazione e menu, coprire fondo area disegno.
Passo 6
Creare due rettangoli: tasto destro su rettangolo, trascinare in area disegno due volte. Ridimensionare ciascuno per metà del corpo principale. Spostarli adiacenti dentro il corpo principale.
Passo 7
Creare campi testo per link navigazione: cliccare pulsante "A Testo" in alto nella barra navigazione. Selezionare area dentro casella navigazione per creare piccolo campo testo cliccando tasto sinistro. Spostare mouse per ridimensionare. Digitare "Home".
Passo 8
Creare altri quattro campi testo col tasto sinistro. Digitare "Voce menu" in ogni casella. Ridimensionare uguali a "Home".
Passo 9
Selezionare area dentro casella intestazione principale, creare campo testo con descrizione "Intestazione principale".
Passo 10
Creare casella testo dentro ogni casella nell'area contenuto principale. Dare descrizione es. "Area contenuto". Ridimensionare uguali. Selezionare pulsante "Puntatore" nel menu navigazione in alto.
Passo 11
Salvare disegno: "File" → "Salva con nome".
Suggerimento
Visio non include stencil o oggetti prototipo GUI, ma terze parti offrono tali strumenti scaricabili. Se intendete usare Visio per design collaborativo, tenete presente che il formato file Visio non è compatibile con la maggior parte dei software di disegno.
Avvertenza
Disegni eccessivamente complessi possono rallentare Visio nell'aggiornamento dopo modifiche.