Jak stworzyć GUI w Visio

...

Microsoft Visio może być używany do tworzenia wielu typów projektów GUI.

Microsoft Visio 2010 to narzędzie do projektowania graficznego, które można wykorzystać do tworzenia diagramów, elementów interfejsu, menu nawigacyjnych i innych obiektów wizualnych. Oferuje szeroką gamę narzędzi do tworzenia projektu graficznego interfejsu użytkownika (GUI). Diagram pokaże, jak aplikacja lub interfejs WWW będzie wyglądał w swojej ostatecznej formie. Opracowywanie graficznego interfejsu użytkownika w programie Visio nie jest zbyt trudne, a projekty można eksportować jako pliki PDF. Postępuj zgodnie z kilkoma wskazówkami, aby dowiedzieć się, jak zbudować podstawową makietę graficznego interfejsu użytkownika dla witryny internetowej.

Krok 1

Otwórz Microsoft Visio. Utwórz nowy rysunek, klikając ikonę pustego rysunku. Kliknij przycisk „Utwórz”.

Wideo dnia

Krok 2

Kliknij okno Kształty po lewej stronie ekranu. Wybierz „Więcej kształtów”. Wybierz opcję „Podstawowe jednostki kształtów amerykańskich”. Kliknij „Szybkie kształty”.

Krok 3

Utwórz pole nagłówka, klikając prawym przyciskiem myszy kształt prostokąta i przeciągając kształt do obszaru rysunku. Zmień rozmiar pola tak, aby obejmowało około 15 procent górnego obszaru rysunku.

Krok 4

Utwórz pole menu nawigacyjnego, klikając prawym przyciskiem myszy kształt prostokąta i przeciągając kształt poniżej pola nagłówka. Zmień rozmiar pudełka, aby mieć wysokość około pół cala i taką samą szerokość jak pole nagłówka.

Krok 5

Utwórz duże pole treści, klikając prawym przyciskiem myszy kształt prostokąta i przeciągając go poniżej pola menu nawigacyjnego. Zmień rozmiar pola, tak aby miał taką samą szerokość jak pola nagłówka i menu nawigacji oraz aby zakrył dół obszaru rysunku.

Krok 6

Utwórz dwa prostokątne pola, klikając prawym przyciskiem myszy kształt prostokąta i dwukrotnie przeciągając kształt do obszaru rysunku. Zmień rozmiar każdego pudełka, aby pasował do połowy pudełka głównego korpusu. Przesuń każde pudełko, aby zmieściło się obok siebie w głównym pudełku.

Krok 7

Utwórz pola tekstowe reprezentujące łącza nawigacyjne, klikając przycisk „Tekst” w górnej części paska nawigacyjnego. Wybierz obszar wewnątrz pola nawigacyjnego, aby utworzyć małe pole tekstowe, klikając lewym przyciskiem myszy. Przesuń mysz, aby zmienić rozmiar pola do żądanej długości. Wpisz tekst, aby powiedzieć „Dom”.

Krok 8

Utwórz cztery dodatkowe pola tekstowe za pomocą lewego przycisku myszy. Wpisz „Pozycja menu” w każdym polu. Zmień rozmiar każdego pola, aby pasował do rozmiaru pola „Dom”.

Krok 9

Wybierz obszar wewnątrz głównego pola nagłówka i utwórz pole tekstowe z opisem „Główny nagłówek”.

Krok 10

Utwórz pole tekstowe wewnątrz każdego pola znajdującego się w głównym obszarze pola zawartości rysunku. Nadaj każdemu polu tekstowemu opis, np. „Obszar treści”. Zmień rozmiar każdego pola tekstowego na taki sam. Wybierz przycisk „Wskaźnik” w górnym menu nawigacyjnym.

Krok 11

Zapisz rysunek, klikając „Plik” w górnym menu nawigacyjnym i wybierając „Zapisz jako”.

Wskazówka

Chociaż Visio nie jest dostarczany z szablonami ani obiektami prototypowymi GUI, firmy zewnętrzne oferują takie narzędzia do pobrania. Jeśli zamierzasz używać programu Visio do tworzenia wspólnego projektu, pamiętaj, że format pliku rysunku programu Visio nie jest zgodny z większością pakietów oprogramowania do rysowania.

Ostrzeżenie

Nadmiernie złożone rysunki mogą powodować spowolnienie w programie Visio odświeżania rysunku po wprowadzeniu zmiany.