Capitolul 1: Informatii esentiale de web design
3: Primul tau miniproiect – cat de bun esti?
4: Iata cum trebuie sa abordezi proiectul
5: De la design la un site functional
6: De ce e absolut necesar un design?
7: Structura unui website
8: Cat costa un website?
9: Diferenta de stres dintre un designer si un programator
Capitolul 2: Cel mai important concept de web design
1: Elementul de baza al oricarui web designer
2: Structuri non-standard
3: Photoshop sau Adobe XD pentru web design?
4: Creeaza o structura standard
5: Cum determini marimea ideala pentru elemente
6: 2 informatii cheie despre fonturi
7: Formatarea textului si alte reguli esentiale
8: Contrast in web design
9: Contrast – studiu de caz 1
10: Contrast – studiu de caz 2
11: Tot ce trebuie sa stii despre codurile de culoare
12: Cum aranjezi elementele in hero area
13: Cum aranjezi iconite cu texte
14: Reguli esentiale pentru iconitele in web design
15: Cum redimensionezi iconite de forme diferite
16: Dezechilibru vizual
17: Greseli de executie la foc automat
Capitolul 3: Rolul tau de designer in dezvoltarea firmei clientului
1: Introducere
2: Obiectivul afacerii
3: Vizitatori versus patroni
4: Site-uri mari fara sens
5: Statistica in web design
6: Wix, SquareSpace si Shopify
7: Studiu de caz: 4 variante pentru aceeasi afacere
8: Prima pagina a unui magazin online
9: Iata de ce designul tau e implementat stangaci
10: Pagina produsului a unui magazin online
11: Procesul de checkout
12: Care este diferenta dintre un landing page si un website?
13: Nu toate site-urile vor sa vanda imediat
14: De ce landing page-urile sunt considerate dubioase?
15: SaaS – noua mina de aur?
16: Studiu de caz: obiectivele clientului
17: Teste A/B
18: Un logo nou – abordarea mea
19: Concluziile capitolului
Capitolul 4: Urmatorul nivel de rafinament in web design
1: Introducere UX si atentie la detaliu
2: UX explicat cat mai clar
3: Cum am dublat cifra de afaceri: de la 5 la 10.000 de euro/luna
4: Cum am imbunatatit pagina de checkout
5: Varianta mobila a magazinului online
6: Varianta mobila – pagina produsului
7: Detalii care fac diferenta
8: Iata cum lucrezi cu un programator
9: Low fidelity, heatmaps si documentatie
10: Concluziile capitolului
Capitolul 5: Primul website - varianta Desktop
1: Analizam proiectul
2: Incepem proiectul desktop cu top bar
3: Construim headerul
4: Culori si fonturi pentru partea superioara
5: Ierarhia din meniul principal
6: Hero area rafinat
7: Cum listam categoriile?
8: Organizarea cardului de produs
9: Variante in web design
10: Prima varianta pentru homepage
11: A doua varianta pentru homepage
12: A treia varianta pentru homepage
13: Zona de intrebari frecvente
14: Formular pentru inscrierea in newsletter
15: Construim footerul
16: Pagina produsului
17: Detalii in pagina produsului
18: Concluziile proiectului desktop
19: Descarca proiectul XD si imaginea PNG
Capitolul 6: Responsive Design
1: Introducere responsive design
2: Varianta mobila sau aplicatie iOS/Android?
3: Adaptam headerul la varianta mobila
4: Construim meniul secundar de categorii
5: Cum afisam produsele din grid – o provocare!
6: Varianta a doua pentru afisarea produselor
7: Zona de intrebari frecvente pentru mobil
8: Ajustam formularul pentru newsletter pentru mobil
9: Reorganizam footer-ul
Capitolul 7: Pagina produsului - varianta mobile
1: Obiectivele redesignului
2: Elementele zonei principale
3: Primele doua variante
4: A treia variatie a paginii produsului
5: Ultima varianta a paginii produsului
6: Construim sistemul de taburi
7: Exercitiu de viteza – recenzii si valori nutritionale
8: Verificam designul in aplicatia Adobe XD de pe mobil
9: Ultimele modificari
10: Concluzii si varianta ta
Capitolul 8: Pregatirea designului pentru implementare (programare)
1: Ce trebuie sa ii dam programatorului?
2: Primul mod de a preda proiectul pentru programare
3: Ce resurse trebuie pregatite in mod special pentru programator?
4: Ce facem cu fonturile speciale?
5: Cum instalam Zeplin in Adobe XD?
6: Cum instalam Zeplin in Photoshop?
7: Pregatirea finala pentru programator
Capitolul 9: Despre bani, freelancing si cum sa incepi
1: Fa asta inainte sa ceri bani!
2: De unde iei primele proiecte?
3: Experienta mea pe 99designs
4: Tot ce trebuie sa stii despre 99designs
5: Freelancer, upwork sau fiverr?
6: Cati bani sa ceri pe munca ta?
7: PFA sau SRL?
8: Nu lucra pana nu intrebi asta:
24 Comments
https://imgur.com/a/7gWMPW9
E fix ce ma asteptam. Doua mentiuni micute: as fi vrut sa vad impartirea footer-ului in coloane si ce anume va fi ok; in meniu, nu mi-e clar de ce sunt 3 elemente diferite in zona meniului. Lucruri micute, dar e bine de avut in vedere ca sunt prea vagi.
https://imgur.com/zKoSCA9
Este o structura buna, solida. Nivelul de detaliu e bun. Ce nu as face – featured service in footer. Nu e locul potrivit. Majoritatea firmelor isi adauga un ‘about us’ acolo, newsletter sign up, sau alte linkuri.
Buna ziua,
Atasez structura mea: https://imgur.com/Fx9aZtd
Multumesc!
Wow, impresionat. Cea mai buna structura pe care am vazut-o postata. Felicitari!
Multumesc frumos!
https://imgur.com/BzYXsBr
Arata bine. Nu cred ca merita sa etichetati fiecare element din main menu. In plus nu as adauga culori de orice fel, ci doar griuri.
https://imgur.com/hpFc4Uf
Arata bine, felicitari! Daca ati reusit sa executati asta in sub 30 de minute e si mai bine!
https://imgur.com/a/yaVbRJH
Bună seara!
Atașez structura standard: https://imgur.com/a/SdsqM0C
Crăciun Fericit!
Un pic cam elaborat, dar e foarte ok. Felicitari!
Salutare
https://imgur.com/Q1V4HxZ
Exact asa trebuie sa arate. Treaba buna!
https://imgur.com/eV4kv8D
Arata bine. Stroke-urile nu sunt necesare, dar e ok. Important e sa mearga rapid.
https://imgur.com/a/ToJFXQq
Mai sus este link ul
Foarte ok lucrat. Spor in continuare!
https://imgur.com/a/ekwbgzc
https://imgur.com/a/ZPeep7P
https://imgur.com/a/ztP77Y3
E foarte precis executat, asa trebuie facut. Treaba buna!