Skocz do zawartości

Galeria projektów stron


tanuki
 Udostępnij

Rekomendowane odpowiedzi

  • 3 tygodnie później...

Ogólnie to jest nieźle, widać że włożyłeś sporo czasu i wysiłku w podnoszenie skilla i na pewno to procentuje chociaż nie widziałem innych projektów z poprzednich lat nie będę odnosił się za bardzo do poszczególnych projektów, omówię całość.


The good

Utrzymujesz odpowiedni kontrast w treści i budujesz czytelny system wizualny, dobrze organizujesz projekty do webu, dobrze zarządzasz typografią i nadajesz odpowiedni priorytet dla poszczególnych elementów systemu, widać, że utrzymujesz treść w predefiniowanym gridzie co podnosi jakość projektu.


The bad

Konstruujesz nader zachowawczy design – relacja: nagłówek—akapit jest mocno widoczna i powoduje dość standardowy monotonny look, widać że obawiasz się zbyt odważnych ewolucji, jako UI designer pomyśl tez nad animacją projektów np. w protopie czy principle. W projekcie z eventami widać, że probowałeś wprowadzić w układzie trochę zamieszania i eksperymentowałeś, ale przebicia innym kolorem nie zrobileś, a nadałoby to projektowi więcej głębi, różnorodności i zwiększyło immersje.


The ugly

Obecne realia rynkowe są takie, że nawet na stanowiskach juniorskich szukają osób które już ogarniają odpowiednią organizacje treści pod wymagania projektowe, braki w kolorze czy typografii można skorygować przez seniora czy design lead’a jednak reorganizacja układu i flow może zająć więcej czasu jednak to zadanie bardziej do ux’a niż w sumie ui designera, skupiające się na języku wizualnym, i odpowiednich relacjach między poszczególnymi elementami, od siebie polecam, żebyś sobie dokładnie przejrzał design patterny, to jest obecnie najważniejsze, aplikacja mobilna ma być przede wszystkim funkcjonalna i inspirowanie się rozwiązaniami które wdrożyły największe marki, po licznych testach i przy użyciu ogromnych zasobów jest bardziej pożądane niż szukanie nowych eksperymentalnych rozwiązań, które można często znaleźć na np. dribbble, gdzie część projektów może znajdzie jakąś wartość i możliwości wdrożenia a może nie.

przejrzyj to:
https://www.interaction-design.org/literature/topics/ui-design-patterns
https://designvault.io/patterns/
https://ui-patterns.com/patterns


Układ

Do webu rozważ rozciągnięcie w pionie i przebicie większym tekstem, w SEO dalej liczy się ilość tekstu i naciupanie słowami kluczowymi ale można użytkownika odciążyć i ukryć część treści np. na hover czy mikro-animacją. Dodatkowo polecam dla ćwiczeń popracować na canonical golden gridzie – pozwoli ci to myśleć widokami, a nie całością projektu + układać treść w relacjach pion—poziom na fullscreenie


Typografia

Zobacz na załącznik, w każdym projekcie warto na bazie treści wyznaczyć skalę typograficzną(co pewnie robisz) i przygotować odpowiedni system i się go trzymać, wiadomo że im większy projekt tym bardziej skomplikowany system jednak im mniej użytych styli tym lepiej. Ja kiedyś pomimo wyznaczania systemu nie przygotowywałem go w takiej formie jak teraz i czasem mi się style gubiły i wymyślałem nowe co miało bardzo negatywny wpływ na projekt

Jak chcesz to wygeneruje kod na -100% i pobierzesz sobie za darmo ostatni produkt, paczka będzie się powiększała z czasem, mam na roadmapie jeszcze dwie duże aktualizacje, ograniczenie się do używania w projektach 40 krojów pisma i głębsza analiza typografii może ci pomóc budować efektywniejsze rozwiązania.

https://fircyk.gumroad.com/l/fontslist
Jak chcesz to daj znać na PW.


Kolor

Jako ćwiczenie możesz sobie zrobić kilka projektów na bazie web safe colors albo systemu pantone
https://websafecolors.info/color-chart

Dodatkowo jakbyś zaczął coś dłubać w identyfikacji to polecam też dobry sposób na odpowiednie dobieranie kolorów 
https://www.letrabit.pl/dobieranie-koloru-cmyk-rgb-pantone/


Ekran appki

Zerknij na załącznik, trochę to się nieczytelne zrobiło, ale nie mam czasu omawiać poszczególnych rzeczy, zerknij na UI design patterny, zobacz jak to działa na aplikacjach na żywo i stwórz sobie jedną małą aplikację, krok po kroku z każdym widokiem bazując na patternach.

 


Podsumowując to projekty na pewno utrzymują poziom, skupiłeś się na digitalu, i polecam skupić się na jednym kierunku by go dobrze wymasterować. 

Jeśli przygotowujesz jakiś projekt to najlepiej jest zrealizować cały, a nie jeden ekran z indeksem na stronie głównej. Lepiej mieć 3 grube projekty w portfolio gdzie przedstawiasz krok po kroku jak pracuje całość niż 15 screenów z różnymi designami bo wielu projektantów ma problem z dalszymi stronami ze względu właśnie na skupianie się tylko na stronie głównej ? jest to mocno odczuwalne od razu, warto skupić się na różnych problemach UI, nie tylko na stronie głównej, i ja wiem, że trzeba więcej pogłówkować, żeby spłodzić coś konkretnego i bardziej złożonego jednak nie tylko można więcej z tego wynieść ale też ma to przełożenie na mocniejsze portfolio


PS polecam jeszcze to https://uiscore.io/library/
fajny zbiór fajnych rzeczy ?


pozdro! 

sc1.png

sc2.png

sc3.png

  • Super! 1
  • Dzięki! 1
Odnośnik do komentarza
Udostępnij na innych stronach

Zapomniałem jeszcze o dwóch kwestiach:

jak zaczynasz projekt aplikacji i ustalasz kolor to warto korzystać z tego: https://colors.eva.design

Kolor teł się mocno różni poziomami jasności u ciebie w appce, możesz sobie wejść w color picker i zmienić z RGB na HSL, wartości L(lightness) powinny być mocno zbliżone, zobacz, że L na głównym kolorze jest na 49 czyli prawie idealnie w połowie, jakby w aplikacji była zmiana motywu z jasnego na ciemny to dobrze by to ze sobą grało niezależnie od motywu

Eva design system pozwala szybko dobierać odpowiednie kolory w oparciu o kolor główny(primary), i jest dobrym punktem wyjścia, np. jeśli używasz 100 na jedno tło to drugiego też bierzesz 100 i kolory mają odpowiednie wartości i minimalny kontrast. Mocno to pomaga w doborze koloru, nie trzeba nadmiernie kombinować, czasem wystarczy tylko lekka modyfikacja. 

Druga sprawa to typografia, Inter to dobry wybór pod UI. System jaki załączyłem to tylko podgląd jak warto wylistować wszystkie style i tworzyć między nimi wizualny kontrast wielkością, grubością kreski i innymi wartościami w obrębie jednego kroju pisma. Natomiast skala 1.618 nie nadaje się do większości rodzajów projektów UI. Mnożnik powinien być dopasowany do rodzaju projektu i treści np. do aplikacji polecam zakres 1.125–1.250, łatwo to ustalić tu: https://type-scale.com (sam gdzieś to chyba wrzucałeś ale dodaje dla innych osób)

 

pzdr 

 

sc1.png

sc2.png

Edytowane przez FIRCYK
  • Super! 1
Odnośnik do komentarza
Udostępnij na innych stronach

Dołącz do dyskusji

Możesz dodać zawartość już teraz a zarejestrować się później. Jeśli posiadasz już konto, zaloguj się aby dodać zawartość za jego pomocą.

Gość
Dodaj odpowiedź do tematu...

×   Wklejono zawartość z formatowaniem.   Usuń formatowanie

  Dozwolonych jest tylko 75 emoji.

×   Odnośnik został automatycznie osadzony.   Przywróć wyświetlanie jako odnośnik

×   Przywrócono poprzednią zawartość.   Wyczyść edytor

×   Nie możesz bezpośrednio wkleić grafiki. Dodaj lub załącz grafiki z adresu URL.

 Udostępnij

Wiadomości

×
×
  • Dodaj nową pozycję...

Powiadomienie o plikach cookie

Umieściliśmy na Twoim urządzeniu pliki cookie, aby pomóc Ci usprawnić przeglądanie strony. Możesz dostosować ustawienia plików cookie, w przeciwnym wypadku zakładamy, że wyrażasz na to zgodę.