Pierwszy projekt nowej strony trafia na spotkanie, na które przyszło pół firmy. Przez godzinę wszyscy dyskutują o odcieniu niebieskiego i zdjęciu w nagłówku. Nikt nie pyta, czemu formularz kontaktowy jest na samym dole, a cennika w ogóle nie ma.
Makieta rozdziela te dwie rozmowy. Jest celowo szara: prostokąty, nagłówki, robocze teksty, miejsca na zdjęcia. Bez kolorów nikt nie spiera się o gust. Rozmowa dotyczy tego, co jest na stronie, w jakiej kolejności i czy klient trafi tam, gdzie chce.
Co pokazuje makieta
- kolejność sekcji i ich wagę,
- nawigację i powiązania między podstronami,
- miejsca na CTA, formularze i zdjęcia,
- układ na telefonie i na komputerze.
Makiety rysuje się na podstawie mapy strony, podstrona po podstronie. Najlepiej od razu na docelowych treściach. Tekst zastępczy ukrywa problemy: nagłówek, który w makiecie miał trzy słowa, w rzeczywistości ma dwanaście i nie mieści się w układzie. Przy sklepie Design Optyk teksty do stref marek klient pisał sam, według makiety, którą dla niego przygotowaliśmy.
Przesunięcie sekcji w makiecie zajmuje chwilę. Ta sama zmiana w gotowym projekcie graficznym oznacza poprawki w kilku widokach, a na wdrożonej stronie dochodzi praca programisty i testy. Im więcej decyzji zapadnie na etapie makiety, tym taniej wychodzi cały projekt. Serwis Porta PRO dla architektów zaczęliśmy od makiety funkcjonalnej, potem powstały widoki na komputer i telefon w Figmie, a na końcu motyw WordPress.
Makieta, prototyp i mockup
Te trzy słowa często padają na jednym spotkaniu. Makieta pokazuje układ. Prototyp pozwala się po stronie poruszać: przyciski działają, ekrany się zmieniają, da się przejść drogę od strony głównej do formularza. Mockup to gotowy projekt graficzny pokazany realistycznie, np. na ekranie laptopa. Służy do oceny wyglądu, a nie układu.