馃帹 uxowy.dev #23
4 min czytania

馃帹 uxowy.dev #23

Dzi艣 b臋dzie troszk臋 mniej designersko i聽馃帹聽UXowo ...ale nie bez powodu. Ust膮pili艣my troch臋 miejsca bardzo wa偶nym rzeczom.

W dzisiejszym wydaniu newslettera:

  1. Must have ka偶dego developera: patterns.dev
  2. #PrzemoPatterns: Radio
  3. Kogo warto obserwowa膰 馃憖
  4. Ebooki od InVision, za free

Ruszamy!


Must have ka偶dego developera: patterns.dev

Development | 藕r贸d艂o
Patterns.dev

Pierwsze ust臋pstwo to development. W ko艅cu tym si臋 zajmujemy, co聽nie? 馃槈 Zarzucamy 藕r贸de艂ko (chocia偶... wcale nie takie ma艂e), kt贸re pozwoli Ci mie膰 mega przydatn膮 wiedz臋 i聽robi膰 web-aplikacje na najwy偶szym poziomie.

Patterns.dev to m.in. zbi贸r pattern贸w dotycz膮cych projektowania web-aplikacji, kt贸ry 艣wietnie t艂umaczy zagadnienia:

  • Design Patterns, m.in.: Singleton, Proxy, Provider, Prototype, Container, Observer, Middleware, Hooks, Factory Pattern i wiele, wiele wi臋cej...
  • Rendering Patterns, m.in.: client/server-side, static rendering; incremental static generation, progressive hydration, islands architecture etc.
  • Performance Patterns, m.in.: 聽loading sequence, static/dynamic import, import on interaction, route based splitting, tree shaking, preload, list virtualization, compression etc.
  • Case Studies - przyk艂ady u偶ycia pattern贸w w聽aplikacjach: Airbnb, Hey.com i聽og贸lnie: Next.js app.

Naszym zdaniem to must-have ka偶dego developera, kt贸ry tworzy front.

To nie s膮 nudne artyku艂y z ton膮 tekstu... To samo mi臋sko urozmaicone filmami, interaktywnymi przyk艂adami kodu, diagramami, tabelami, przyk艂adami itd. Zobacz przyk艂ad:

Wizualizacja dzia艂ania virtual-scrolla. 殴r贸d艂o

W dodatku, patterns.dev wyda艂o ebooka Learning Patterns do pobrania za darmo, a w sekcji Resources linkuje do zewn臋trznych artyku艂贸w i聽film贸w, wow 馃敟

Patterns.dev/resources

Wejd藕 koniecznie i czytaj regularnie 馃殌
www.patterns.dev


#PrzemoPatterns: Radio

馃 Co to jest?

Radio-button to z pozoru banalna sprawa, klikamy w聽jakie艣 k贸艂eczko, wybieramy opcj臋 i gotowe. Niemniej jednak, jest kilka pu艂apek, kt贸re warto omija膰. Bez zb臋dnych wst臋p贸w - przeczytajcie, o czym pami臋ta膰 przy okazji u偶ycia tego elementu:

鈩癸笍 Wskaz贸wki

  • Aby u偶ycie radio-buttona mia艂o sens, powinni艣my mie膰 list臋 co najmniej dw贸ch mo偶liwych opcji
  • U偶ytkownik mo偶e zaznaczy膰 tylko jeden (!) radio-button
  • Domy艣lnie zaznaczmy jeden z radio-button贸w, nie zawsze musi to by膰 pierwsza opcja, mo偶e to by膰 ta bardziej prawdopodobna, oparta na wcze艣niejszych badaniach i聽do艣wiadczeniach
  • Radio z kr贸tkimi etykietami mo偶emy wyr贸wna膰 w poziomie, zwykle powinni艣my umieszcza膰 je w pionie (jeden pod drugim)
  • Klikalno艣膰: zastan贸wmy si臋, w co mo偶na klikn膮膰, aby aktywowa膰 radio-button (etykieta tekstowa, ca艂y kontener?); dla u偶ytkownika by艂oby przyja藕niej, gdyby nie musia艂 celowa膰 idealnie w to niewielkie k贸艂eczko 馃槈
Przyk艂ad radio-button贸w z ciekaw膮 animacj膮. 殴r贸d艂o

Wi臋cej o radio-buttonach mo偶esz przeczyta膰 tutaj:
uxplanet.org/radio-buttons-ux-design


Kogo warto obserwowa膰?

Twitter Niebezpiecznika

Niebezpiecznik

To drugie odst臋pstwo od naszych temat贸w UI/UX-owych. W aktualnym czasie bezpiecze艅stwo cyfrowe jest jedn膮 z聽najwa偶niejszych kwestii, wi臋c... przypominamy Ci o聽tym zarzucaj膮c (pewnie dobrze Ci ju偶 znan膮, ale... najlepsz膮) stron臋, jak膮 mo偶emy - niebezpiecznik.pl.

Tutaj mo偶esz 艣ledzi膰 najnowsze wie艣ci:
Twitter: @niebezpiecznik
Facebook: niebezpiecznik
LinkedIn: niebezpiecznik


Ebooki od InVision, za free

Resources | 藕r贸d艂o
DesignBetter.co

InVision w 艣wiecie UX nikomu nie trzeba przedstawia膰. To popularne narz臋dzie do designu i prototypowania.

Mamy dzi臋ki nim kilka interesuj膮cych ebook贸w do pobrania, zupe艂nie za聽darmo, m.in.:

  • Enterprise Design Sprints - What design sprints do for enterprises, When to sprint, Planning your design sprint, Beyond the five phases...
  • Design Systems Handbook - Designing, Building & Expanding your design system, The future of design systems...
  • Design Thinking Handbook - Why we need design thinking, Empathize, Define, Ideate, Prototype, Test.
  • Design Engineering Handbook - Design Engineering Process, Engineering Collaboration, Organizational Models, Leadership...
  • Animation Handbook - Motion鈥檚 purpose, Principles of animation, Animation collaboration, Taking animation further.

Oblukaj: www.designbetter.co


To wszystko na dzi艣.

...aaa i dzi艣 bez memika 鈽癸笍
Za to z live-map膮 tego, co si臋 dzieje na Ukrainie i聽bardzo cz臋stymi aktualizacjami ze zdj臋ciami/filmami (偶eby by膰 na bie偶膮co i nie trzeba by艂o ogl膮da膰 telewizji...):
liveuamap.com


Pom贸偶 innym wiedzie膰 wi臋cej

Znasz kogo艣, kto powinien do艂膮czy膰 do naszej spo艂eczno艣ci? Je艣li tak, to wy艣lij do tej osoby link do skr贸tu z ostatnich wysy艂ek: uxowy.dev/lista. I聽niech do艂膮czy do 馃帹聽uxowy.dev!

Je艣li jeszcze nie ma Ci臋 na li艣cie 馃

Wysy艂amy jeden email tygodniowo, w ka偶dy pi膮tek, o godz. 12:00.
Warto艣ciowa wiedza o UI/UX dla developera mo偶e wyl膮dowa膰 do Twojej skrzynki.