Ostatnio na zmianę projektowaliśmy wersje mobilne i desktopowe projektów. Ale dobrze już wiecie, że projektując stronę trzeba od razu myśleć o różnych rozdzielczościach – i tym jak nasze elementy będą zachowywać się na dużym ekranie i tym mniejszym, dotykowym. Dlatego 19 zadanie będzie dotyczyło wersji mobilnej i desktopowej koszyka w sklepie internetowym!
Spotkanie podsumowujące tego zadania odbyło się już na YouTube:
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 – robimy takie 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ę. Jeżeli jesteście ciekawi jak wyglądało takie spotkanie online ostatnio, to zerknijcie na kanał, na nagranie z podsumowania Idź Pan w UI! #18
Jak dołączyć do wyzwania UI?
Do tego zadania już nie można dołączyć – warto sprawdzić czy nie trwa właśnie nowe wyzwanie.
Treść zadania UI
Temat: Koszyk w sklepie internetowym
Deadline: 2 października 2021 (do końca dnia)
Format: projekt widoku strony mobilnej (375 px) i wersji desktopowej (1440 px)
Cel zadania: Celem zadania będzie pokazanie jak zaprojektowany przez was koszyk zakupowy wygląda w wersji desktopowej, a jak zmienia się w wersji mobilnej.
Obowiązkowe elementy takiego widoku to: No właśnie, co? W tym zadaniu nie listuję elementów, które muszą znaleźć się w widoku koszyka. Tym razem wybranie elementów będzie po stronie projektantów. Wyobraźcie sobie, że to marka zgłasza się do was o pomoc – stańcie więc w roli osób, które zaproponują najlepsze rozwiązanie. Nie zostawię was tak zupełnie bez niczego. Zastanówcie się:
– Co jest głównym elementem takiego koszyka? Po co się go otwiera?
– W jaki sposób nawiguje się między kolejnymi krokami, a jak wraca się do widoku np. produktów na liście lub konkretnego produktu?
– Jak wyglądają produkty w koszyku? Co jest najważniejsze żeby je móc między sobą rozróżnić?
– Co mogę robić z dodanymi do koszyka produktami?
Marka: Dla jakiego sklepu będziemy projektować ten koszyk? Niech będzie to sklep odzieżowy! To dla jakiego typu sklepu go projektujecie może mieć całkiem spore znaczenie, więc zachęcam do eksploracji i researchu, jeśli to wasz pierwszy koszyk zakupowy.
Sklep dla którego projektujecie to mała marka odzieżowa – Sory (marka i nazwa zupełnie wymyślona, nie szukajcie tej marki jako inspiracji w sieci). Specjalizują się w odzieży damskiej, która charakteryzuje się bardzo prostymi krojami. Dużą uwagę przywiązują do detali i jakości, wybierają najlepsze materiały, więc zaprojektowana strona powinna to odzwierciedlać. Projekty ubrań tworzone są w stonowanych barwach, sporo czerni, szarości, bieli i beżu, ale znajdą się też kolory żywsze jak błękity i zielenie. Logo to prosty, bezszeryfowy, czarny krój – możecie napisać je sobie jeśli uznacie, że go potrzebujecie.
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.
