I PA S K A I TA
Interneto praeitis, dabartis
ir ateitis
Tinklapių dizainas
Jonas Lekevičius, 2014
Slide 2
Slide 2 text
Šiandien matysite!
Slide 3
Slide 3 text
Šiandien matysite!
• Susipažinkime!
Slide 4
Slide 4 text
Šiandien matysite!
• Susipažinkime!
• Ką aš dėstysiu (užuomina: tinklapių dizainą)
Slide 5
Slide 5 text
Šiandien matysite!
• Susipažinkime!
• Ką aš dėstysiu (užuomina: tinklapių dizainą)
• Interneto istorija
Slide 6
Slide 6 text
Šiandien matysite!
• Susipažinkime!
• Ką aš dėstysiu (užuomina: tinklapių dizainą)
• Interneto istorija
• Šiuolaikinis interneto dizainas ir ateities
tendencijos
Slide 7
Slide 7 text
Šiandien matysite!
• Susipažinkime!
• Ką aš dėstysiu (užuomina: tinklapių dizainą)
• Interneto istorija
• Šiuolaikinis interneto dizainas ir ateities
tendencijos
• Interneto pataršymas
Slide 8
Slide 8 text
Šiandien matysite!
• Susipažinkime!
• Ką aš dėstysiu (užuomina: tinklapių dizainą)
• Interneto istorija
• Šiuolaikinis interneto dizainas ir ateities
tendencijos
• Interneto pataršymas
• Kurso ir savaitės projektas
Slide 9
Slide 9 text
Susipažinkime
Slide 10
Slide 10 text
Trumpai apie mane
Slide 11
Slide 11 text
Trumpai apie mane
• Kuriu puslapius jau beveik 10 metų.
Slide 12
Slide 12 text
Trumpai apie mane
• Kuriu puslapius jau beveik 10 metų.
• Dirbau su daugybe skirtingų technologijų.
Slide 13
Slide 13 text
Trumpai apie mane
• Kuriu puslapius jau beveik 10 metų.
• Dirbau su daugybe skirtingų technologijų.
• Dabar gaminu appsus Lemon Labs.
Trumpai apie jus
• Žino kažką apie tinklapių dizainą?
Slide 18
Slide 18 text
Trumpai apie jus
• Žino kažką apie tinklapių dizainą?
• Esate kūrę tinklapį?
Slide 19
Slide 19 text
Trumpai apie jus
• Žino kažką apie tinklapių dizainą?
• Esate kūrę tinklapį?
• Turi savo tinklapį?
Slide 20
Slide 20 text
Trumpai apie jus
• Žino kažką apie tinklapių dizainą?
• Esate kūrę tinklapį?
• Turi savo tinklapį?
• Žino, kas yra ES6, WebGL, SCSS?
Slide 21
Slide 21 text
Trumpai apie jus
• Žino kažką apie tinklapių dizainą?
• Esate kūrę tinklapį?
• Turi savo tinklapį?
• Žino, kas yra ES6, WebGL, SCSS?
• Atrodo, kad tinklapių dizainas gali būti įdomu?
Slide 22
Slide 22 text
Kurso apžvalga
Slide 23
Slide 23 text
TIKSLAS
Išmokti kurti tinklapius.
Slide 24
Slide 24 text
Ne vieną nedidelę dalį, o nuo
pradžios iki pabaigos.
Slide 25
Slide 25 text
Galvoti apie informaciją,
jos architektūrą,
vartotojo patirtį.
Slide 26
Slide 26 text
Suplanuoti, kaip dizainas adaptuojasi
prie skirtingų ekranų ir formatų,
besikeičiančio turinio.
Slide 27
Slide 27 text
CSS
HTML
JS
Slide 28
Slide 28 text
Įvadas į tinklapių dizainą
Informacijos
architektūra ir vartotojo
patirtis
HTML: turinys su
struktūra
CSS: išdėstymo būdai ir
technikos
Šiuolaikinis tinklapių
dizaino procesas
Praktiniai dalykai:
baneriai, talpinimas ir
domenai...
CSS: animacijos ir
tipografija
JavaScript: tinklapių
programavimo kalba
Apibendrinimas ir
patarimai ateičiai
jQuery: dinaminiai
tinklapių efektai
Grafikos paruošimas
tinklapių dizainui
CSS: aprašomasis
dizainas
Slide 29
Slide 29 text
Interneto istorija
Slide 30
Slide 30 text
1 9 6 9
Pirmasis internetas, ARPANET.
TCP / IP, JAV kariuomenei.
Source: Wikipedia
Slide 31
Slide 31 text
1 9 7 7
El. paštas
Ankstyviausios užuominos net
1962.
Slide 32
Slide 32 text
1 9 7 8
Bulletin board system
Forumiukai neliūdi!
Source: Wikipedia
Slide 33
Slide 33 text
1 9 8 2 - 0 9 - 1 9
:-)
Svarbus įvykis žmonijos istorijoje.
Source: bluejayblog
Slide 34
Slide 34 text
I propose that the following character
sequence for jokemarkers: “:-)”
Read it sideways. Actually, it is probably
more economical to mark things that are
NOT jokes, given current trends. For this,
use “:-(“
Scott E. Fahlman
Slide 35
Slide 35 text
Eternal September
Laikas nuo 1993 rugsėjo
Slide 36
Slide 36 text
1 9 8 9
HTTP, HTML ir WWW
Tim Berners-Lee
Source: Wikipedia
Slide 37
Slide 37 text
1 9 8 9
HTTP, HTML ir WWW
Tim Berners-Lee
Source: Wikipedia
Slide 38
Slide 38 text
1 9 9 4
W3C
World Wide Web Consortium
Slide 39
Slide 39 text
1 9 9 0
WorldWideWeb
Pirma naršyklė
Source: Wikipedia
Slide 40
Slide 40 text
1 9 9 3
Mosaic
Pirma populiari naršyklė
Source: Wikipedia
Slide 41
Slide 41 text
1 9 9 4
Netscape
Source: Wiki
Slide 42
Slide 42 text
1 9 9 5
Internet Explorer
Source: Wiki
Slide 43
Slide 43 text
1 9 9 5
JavaScript
Slide 44
Slide 44 text
1 9 9 6
Cascading Style
Sheets
Slide 45
Slide 45 text
1 9 9 4
Geocities
Source: Wikipedia
Slide 46
Slide 46 text
1 9 9 4
Yahoo
Slide 47
Slide 47 text
1 9 9 6
AltaVista
Slide 48
Slide 48 text
1 9 9 6
Google
Source: Wikipedia
Slide 49
Slide 49 text
1 9 9 5
PHP
Slide 50
Slide 50 text
2 0 0 1
Drupal
Slide 51
Slide 51 text
2 0 0 2
Mozilla
Slide 52
Slide 52 text
2 0 0 3
Safari
Slide 53
Slide 53 text
Web 2.0
Slide 54
Slide 54 text
2 0 0 3
Designing
with Web
Standards
Jeffrey Zeldman
Slide 55
Slide 55 text
No content
Slide 56
Slide 56 text
2 0 0 3
WordPress
Slide 57
Slide 57 text
2 0 0 4
Flickr
Slide 58
Slide 58 text
2 0 0 4
Gmail
Slide 59
Slide 59 text
2 0 0 4
Facebook
Slide 60
Slide 60 text
2 0 0 6
Twitter
Slide 61
Slide 61 text
No content
Slide 62
Slide 62 text
2 0 0 5
Adobe nusiperka
Macromedia
Slide 63
Slide 63 text
No content
Slide 64
Slide 64 text
No content
Slide 65
Slide 65 text
Uch…
Slide 66
Slide 66 text
2007 m. sausį nutiko…
Slide 67
Slide 67 text
No content
Slide 68
Slide 68 text
2 0 1 0
Thoughts on Flash
Steve Jobs
Source: Wikipedia
Slide 69
Slide 69 text
2 0 1 0
Responsive Web Design
Ethan Marcotte
Source: Wikipedia
Slide 70
Slide 70 text
2 0 0 8
Chrome
Slide 71
Slide 71 text
2 0 1 1
Chromebook
Slide 72
Slide 72 text
Šiuolaikinės tinklapių
dizaino tendencijos
Slide 73
Slide 73 text
Web Apps
Slide 74
Slide 74 text
No content
Slide 75
Slide 75 text
Responsive Web Design
Slide 76
Slide 76 text
Web Fonts
Slide 77
Slide 77 text
No content
Slide 78
Slide 78 text
Labai greitas JavaScript
Slide 79
Slide 79 text
Apps
Slide 80
Slide 80 text
Mobilaus dizaino įtaka
Slide 81
Slide 81 text
Užduotys
Slide 82
Slide 82 text
SAVAITĖS UŽDUOTIS
Pasirinkti puslapį ir jį kūrybingai sutaršyti.