Idź Pan w UI! #23 – redesign rezerwacji biletów

Odręczne rysunki komponentów interfejsu z napisem Idź Pan w UI i nazwą zadania

Redesign? Tego chyba jeszcze nie robiliśmy!

Na początku stycznia wybrałam się na kilka dni do Gdańska. Żeby sobie odpocząć, zjeść coś dobrego i zobaczyć kilka miejsc, których okazji jeszcze zwiedzić nie miałam. Na mojej liście było min. polecane przez was Muzeum II Wojny Światowej. I wszystko było świetnie, dopóki nie miałam okazji… rezerwować biletu na ich stronie mobilnej. Stwierdziłam, że to cudowny przykład na ćwiczenie (nawet nie tylko UIowe), ale redesign całego obszaru zakupu biletu byłby na razie dla mnie nierealny do oceny i zostawienia feedbacku (który zająłby mi po prostu miliony godzin).

Dlatego wybrałam dla Was jeden ekran, który trzeba będzie zaprojektować od nowa, a dla chętnych wrzucam ćwiczenie – spróbujcie zaprojektować cały proces od początku do końca – bo jest co poprawiać. Nie musicie mi wysyłać całości (oceniać i przeglądać będę i tak tylko ten jeden widok z zadania).

W tym zadaniu nie będziemy używać identyfikacji Muzeum II Wojny Światowej, bo nie mamy na to zgody (np. żebyście mogli sobie potem to wrzucić do portfolio). Bezpiecznie będzie wykorzystać nazwę strony „Muzeum” i wybrać dowolną warstwę wizualną – tak, tak, to znaczy, że macie pełną dowolność jeśli chodzi o barwy i typografię!

Co to jest wyzwanie UI?

Treść zadania możecie wykorzystać jako inspirację do nowego projektu do portfolio, formę ćwiczenia lub wziąć udział w wyzwaniu, zrealizować zadanie i wysłać je do mnie w określonym terminie. Ja w niedługim czasie przygotowuję spotkanie online na kanale YouTube (by Zebza), gdzie omawiam wybrane projekty – czyli robimy sobie spotkanie w formie korekty.

Z nadesłanych projektów wybieram kilka. Pozwoli to pokazać lepsze i słabsze projekty, omówić dobre strony i popularne błędy. A przede wszystkim – będę mogła opowiedzieć wam więcej o dobrych praktykach i wzorcach. Dzięki temu, spotkania będą krótsze i bogatsze w wiedzę. Wszyscy uczestnicy dostaną także krótki feedback do projektu na maila (po publikacji naszego podsumowania na YouTube). Jeżeli jesteście ciekawi jak wyglądało takie spotkanie online ostatnio, to zerknijcie na Idź Pan w UI! #22.

Jak dołączyć do wyzwania UI?

Do tego zadania już nie dołączyć, ale zerknij czy nie pojawiło się przypadkiem jakieś nowe, o tutaj.

Treść zadania UI

Temat: Redesign widoku rezerwacji biletu na stronie mobilnej

Deadline: 14 lutego 2022 (do końca dnia)

Format: projekt widoku strony mobilnej na szerokość 375 px 

Cel zadania: Celem zadania jest redesign jednego widoku strony mobilnej, służącej do rezerwacji biletu do muzeum. A dokładnie podstrony pokazującej siatkę dostępnych godzin, której screen załączam również poniżej. Link będzie otwierał pierwszy krok (niestety przeładowuje automatycznie z kroku 2 na 1, kiedy próbujemy go podlinkować). Żeby przejść do tej magicznej podstrony musicie po prostu wybrać opcję „kup bilet”. Jak już znajdziecie ją na mobajlu ?

Strona przestała działać (mam nadzieję, że to nie przez nas), więc podrzucam linki do obrazków w większej rozdzielczości: ekran z wyborem godzintutaj jest screen okienka modalnego.

Widoki ekranów do przeprojektowania na potrzeby zadania – widoki mobilne składające się z zeskalowanej w dół strony z małą siatką godzin, które nie są zbyt czytelne przez kolor i ich rozmiar.

Na potrzeby zadania załóżcie, że wszystkie treści i funkcje są koniecznie do przełożenia na nowy projekt. Oczywiście niekoniecznie w tej konkretnej formie. Zastanówcie się jak będzie wyglądał przedział godzinowy już niedostępny lub taki z kończącą się liczbą miejsc. Jak zmieścicie wszystkie te informacje na mobilnym ekranie? I co zrobicie żeby łatwo się po nich poruszać?

Zachęcam was bardzo do eksploracji. Zobaczcie jak wyglądają inne muzea, galerie sztuki i pozostałe miejsca, w których istotna jest rezerwacja związana z przedziałem czasu (na pewno znajdziecie takich trochę).

Co z brandingiem? Jak wspomniałam – nie pisałam do Muzeum II Wojny Światowej o pozwolenie na użycie ich identyfikacji na potrzeby zadania. Dlatego proszę abyście używali neutralnej nazwy MUZEUM jako logo, a paletę kolorów i typografię czy inne elementy graficzne, wypracowali według własnego uznania.

Chcesz być na bieżąco?

Żeby być na bieżąco z kolejnymi zadaniami i informacjami o spotkaniach na żywo, najwygodniej dopisać się do newslettera, bo dzięki temu, prosto na maila dostaniecie każdą informację. Można po prostu śledzić bloga albo moje kanały na portalach społecznościowych, ale algorytmy bywają okrutne i jest szansa, że nie zawsze wyświetlą się wam powiadomienia o nowym zadaniu. Newsletter ten problem eliminuje. Zapisz się do newslettera tutaj.

You May Also Like
Read More

Idź Pan w UI! #29 – strona przychodni

Jesteśmy po podsumowaniu zadania #28, więc czas na kolejne. Przyznam, że inspirację znalazłam zupełnie przypadkowo szukając w Holandii… lekarza. Okazuje się, że przychodnie i prywatne…