Wireframe, ing... co?
Wireframe slouží pro návrh tvé aplikace. Nenapíšeš ani řádek kódu a budeš dokonale vědět jak tvá aplikace má fungovat.
- 0.
Wireframing
Pochopíš účel a využití techniky jménem Wireframing. Objevíš celý vývojový cyklus s wireframingem a nakonec pohlédneš pod pokličku korporátu. Poznáš specifické zaměstnanecké role se zaměřením na tento problém a zjistíš, jak to funguje v korporátu.
16mZdarma ke zhlédnutí - 1.
Webové komponenty a sekce
Využiješ zkratku a podíváš se do "budoucnosti", která tě čeká jako Frontend Developera. Objevíš komponenty a principy, pomocí kterých budeš stavět nejenom celé aplikace, ale i svůj Wireframe.
22mZdarma ke zhlédnutí - 2.
Stážistický projekt
Pohlédneš do zákulisí korporátních stáží. Objevíš druhy stáží, jejich výhody a co stážisti na této stáži staví a vytvářejí. Nakonec zjistíš, co budeš stavět za stážistický projekt a jaký mindset potřebuješ, aby se z tebe stal ten "nejlepší" developer.
9mZdarma ke zhlédnutí - 3.
Excalidraw
Naučíš se Excalidraw, celý proces práce zefektivníš a staneš se pokročilým uživatelem. Vše budeš ovládat jednoduše a rychle díky klávesovým zkratkám a pokročilým postupům. K tomu objevíš diagramy a zjistíš jak řešit běžné i systémové chyby, spojené s touto funkcí.
24m - 4.
Knihovna komponent
Postavíš svou knihovnu komponent - navrhneš základní prvky potřebné pro stavbu webových aplikací ve tvém wireframe. Nakonec objevíš dva způsoby jak tuto knihovnu v Excalidraw používat a usnadnit si tvorbu wireframe.
24m - 5.
Wireframe - Landing page
Postavíš wireframe tvé úvodní stránky v nástroji Excalidraw. Objevíš sekce, které musí mít každá úvodní stránka, navrhneš je a provedeš jejich datovou analýzu. Nakonec zjistíš, co je to "hub" a dozvíš se korporátní příběh spojený s tímto "hubem".
26m - 6.
Wireframe - Projekty
Postavíš wireframe stránky s přehledem tvých projektů a provedeš datovou analýzu. Navíc zjistíš, proč je vše jednodušší, než když si dělal svou první stránku - úvodní stránku.
3m - 7.
Wireframe - Detail projektu
Postavíš wireframe stránky s detailem jednoho projektu s přehledem projektů a provedeš datovou analýzu.
7m - 8.
Wireframe - Blog
Postavíš wireframe stránky s tvým blogem a provedeš datovou analýzu. Navíc objevíš způsoby stránkování, neboli paginace, které budeš na svém blogu moct využít.
5m - 9.
Wireframe - Blogový příspěvek
Postavíš wireframe tvé úvodní stránky v nástroji Excalidraw. Získáš základní přehled o jednotlivých sekcích ve tvém wireframu. Jednotlivé sekce navrhneš a provedeš jejich datovou analýzu pro získání všech dat - využiješ ve frontend a backend fázi.
4m - 10.
Wireframe - Kontakt
Postavíš wireframe kontaktní stránky s tvým příběhem, kontaktními údaji a přehledným rozvržením. Pochopíš, že i jednoduchá stránka může být uživatelsky přívětivá.
5m - 11.
Wireframe - Admin - Login
Navrhneš přihlašovací stránku pro administraci. Zaměříš se na přehlednost, základní UX principy login formulářů a nakonec i bezpečnost spojenou s příhlašováním.
5m - 12.
Wireframe - Admin - Layout
Navrhneš základní layout pro administraci – hlavičku, postranní navigaci a hlavní obsah. Připravíš si kostru pro všechny admin stránky.
6m - 13.
Wireframe - Admin - Projekty
Navrhneš stránky pro správu projektů v administraci. Připravíš si tabulku, akční tlačítka, formuláře a naučíš se, jak efektivně tohle vše zobrazit.
9m - 14.
Wireframe - Admin - Blog
Navrhneš administrační rozhraní pro správu blogových příspěvků. Připravíš si přehled, kde budeš moct články upravovat, vytvářet nebo mazat, formulář pro jejich správu a nakonec ho rozšíříš o správu komentářů.
4m - 15.
Wireframe - Admin - Techstack
Navrhneš administrační rozhraní pro správu tvých naučených a vyzkoušených technologií. Připravíš si stránku, kde můžeš přidávat, upravovat nebo mazat technologie používané v projektech a formulář pro jejich správu.
2m - 16.
Wireframe - Admin - Nastavení
Navrhneš administrační rozhraní pro správu globálního nastavení. Kontaktní údaje, metadata a další obecné informace ve tvé aplikaci.
5m