1. CO DEPCZE PO PIĘTACH WEB 2.0
czyli aktualne trendy w projektowaniu WWW
Geek Girls Carrots Białystok

2. JAK KSZTAŁTUJĄ SIĘ TRENDY?
- Możliwości technologiczne
- Podążanie za trendsetterami
- Moda
- Gusta ;-)
Geek Girls Carrots Białystok

3. KRÓTKO O EWOLUCJI TRENDÓW
czyli jak wyglądał internet w czasach prehistorycznych ;-)

4. WCZESNE LATA '90
- Strony wyłącznie tekstowe
- Jednokolumnowe
- Czysty HTML
- Brak grafik - wolne łącza i słabe komputery,
inne wyobrażenie o tym, czym jest internet

5. WCZESNE LATA '90

6. WCZESNE LATA '90

7. POŁOWA LAT '90
- Początek tabel - bardziej skomplikowane rozmieszczanie treści
- Animowane gify
- Migające teksty
- Sztywny 2 lub 3-kolumnowy układ
- Małe rozdzielczości
- Ciągle brak "designu"

8. POŁOWA LAT '90
lingscars.com – ciągle funkcjonuje w takiej formie ;-)

9. KONIEC LAT '90
- Początek ery flasha
- Animacja - głównie animowane komiksy webowe
- Strony startowe - splash
- Wizualny chaos ;-)

10. KONIEC LAT '90

11. KONIEC LAT '90

12. KONIEC LAT '90

13. PIERWSZA DEKADA XXI WIEKU
- Coraz więcej Flasha
- Era web designera - początek ;-)
- CSS
- Java script
- Większe możliwości - większe problemy

14. PIERWSZA DEKADA XXI WIEKU

15. PIERWSZA DEKADA XXI WIEKU

16. PIERWSZA DEKADA XXI WIEKU

17. FACEBOOK W 2004

18. ŹRÓDŁA NOWYCH TRENDÓW
Apple - iPhone

19. ŹRÓDŁA NOWYCH TRENDÓW
- "Realizm do kwadratu"
- Skeumorfizm -
przeniesienie wyglądu
przedmiotów rzeczywistych do
iPhone
świata wirtualnego aby poprawić
przyjazność i użyteczność
- Różnorodność
- Oddźwięk w coraz
popularniejszych graficznych
stylach stron internetowych

20. ...JESZCZE NIE TAK DAWNO TEMU...
- Nacisk na grafikę – rola tylko wizualna
- Tekstury
- Realizm
- Światłocienie
- "Projektowanie na bogato"
- Wykorzystanie zdjęć stockowych
- Rendery 3D

21. ...JESZCZE NIE TAK DAWNO TEMU...

22. ...JESZCZE NIE TAK DAWNO TEMU...

23. ...JESZCZE NIE TAK DAWNO TEMU...

24. WSZYSTKO FAJNIE, ALE...
- Waga!
- Skomplikowane wdrożenie
- Czasochłonność
- Często przerost formy nad treścią

25. WEB 2.0

26. WEB 2.0
- Gradienty
- Cienie
- Efekt "szkła"
- Mac OSX
- Style nawiązujące do WinXP, Win7

27. WEB 2.0

28. WEB 2.0

29. WEB DESIGN 2013
co się zmieniło i kto za tym stoi?

30. WEB DESIGN 2013
co się zmieniło i kto za tym stoi?

31. TRENDY 2013 – "Metro Style"
- Dieta Bezgradientowa; minimalizm
- Swiss Style
- Proste, dobrze skrojone bezszeryfowe fonty
- Nacisk na typografię
- Siatka
- Układ asymetryczny
- Duże zdjęcia
- Content is King

32. TRENDY 2013

33. TRENDY 2013

34. TRENDY 2013
Geek Girls Carrots Białystok

35. TRENDY 2013

36. TRENDY 2013

37. TRENDY 2013

38. WEB DESIGN 2013
no dobrze, ale CO się właściwie stało?

40. JAK MOBILE ZMIENIŁO WWW
- Internet to nie tylko komputery
- Wersje mobilne vs. Desktopowe
- Próby dopasowania www do urządzeń na rynku
- Coraz większa ilość urządzeń o bardzo różnych parametrach
www.craftedbydavid.com

41. RESPONSIVE DESIGN
Responsive
web design
to sposób
konstruowania stron
internetowych tak,
aby samoistnie
dopasowywały się
one do różnych
urządzeń, na których
będą przeglądane.
99designs.com

42. CO JESZCZE
RZĄDZI
W 2013?

43. WHITE SPACE
czyli pozwól treści oddychać

44. WHITE SPACE

45. ŁATWIEJSZA
NAWIGACJA
"przyklejone" paski menu

46. "PRZYKLEJONA" NAWIGACJA

47. INFINITE SCROLL
SINGLE-PAGE WEB DESIGN
nowe podejście do user experience

48. INFINITE SCROLL I SINGLE-PAGE WEB DESIGN
http://tumblr.com/

49. INFINITE SCROLL I SINGLE-PAGE WEB DESIGN
lookslikegooddesign.com

50. INFINITE SCROLL I SINGLE-PAGE WEB DESIGN
reformrevolution.com

51. APLIKACJA ZAMIAST STRONY
czyli dlaczego warto zainteresować się
projektowaniem aplikacji mobilnych od strony graficznej

52. TECHNOLOGIA W SŁUŻBIE
DESIGNU ;-)

53. SKĄD CZERPAĆ INSPIRACJE?
- Z internetu :P
A konkretniej:
- DesignInstruct.com
- Smashing Magazine
- Dribbble
- FWA
- webdesignerdepot.com
- aWWWards.com

54. O CZYM WARTO PAMIĘTAĆ?
- Internet to nie tylko komputery
- Dobieramy styl do produktu/klienta
- Usability > Wygląd
- Mniej znaczy więcej

55. ...since 1996 ;-)
Space Jam – Kosmiczny Mecz – strona z 1996 która wciąż funkcjonuje ;-)

56. Dziękuję :-)
Marta Rhea Gawlicka gawlickamarta@gmail.com
+48 604 53 93 99
Art Director // Infinity Group
facebook.com/rhealogan