Webdesign

Když jsem nastoupil na MUNI, tak jsem zjistil, že je jednak možnost a za druhé že je vhodné, si vytvořit svou vlastní webovou prezentaci. O toto jsem se pokusil. Mé snahy z počátku nebyli nijak valné a většinou jsem se uchýlil k využití freetempletů, které jsem různě našel.

Kromě toho se vyskytla nutnost vytvořit internetovou prezentaci některým projektům, na kterých jsem spolupracoval, nebo které jsem dělal. Vzhledem k tomu, že jsem pouze chudý student, nemohl jsem si dovolit zaplatit někomu za to, že mi tyto prezentace vytvoří. Proto jsem byl nucen se uchýlit k tomu, že jsem začal vytvářet své vlastní prezentace

Netrvalo dlouho, a někteří z mých známých, i lidí které jsem do té doby neznal, zjistili, že dělám webové stránky a požádali mne proto, zda bych jim také nějaké nevytvořil. Zde, na této stránce jsou pak zveřejněny ty mé práce, o kterých si myslím že mě osobně něco dali.

horus Horus ex Machina ~ http://horus.phorum.cz
Má první „zakázka“ a vlastně i první pokus o kvalitní webovou prezentaci. Poprvé jsem se navíc setkal s případem, že měl někdo konkrétní představu a konkrétní požadavky, se kterýma jsem se musel vypořádat. Výsledkem je právě tato prezentace, která je v podstatě přesně k obrazu Martinovu :)
Prezentace je založena na prostém HTML + CSS s prvky PHP. Uspořádání je pak do několika divů, mezi kterými se přepínají texty, fotky i jazykové mutace.
posel LARP Posel boží ~ http://poselbozi.larp.cz
Toto jsou stránky LARPu, který se snažím pořádat. Stránky samotné mají poměrně dlouhou historii. Původně jsem dělal pouze grafický návrh těchto stránek, který potom dokončil můj přítel Ytriag. Ten dělal nejdříve i celé stránky. Bohužel tyto stránky nebyly tak zcela funkční ve všech prohlížečích. Proto jsem se rozhodl začátkem tohoto roku tyto stránky předělat. Změna se týkala kompletního předělání lyoutu i úpravy grafiky do podoby, jakou mají stránky teď.
Stránky jsou opět kombinací HTML + CSS s prvky PHP. Grafický prvek těchto stránek je jeden ucelený obrázek, přez který je umístěno několik divů.
mol Moravian LARP, o.s. ~ http://moravianlarp.eu
Na podzim roku 2007 jsem se stal jedním ze zakladatelů občanského sdružení Moravian LARP, o.s. Opět padlo na mne, abych vytvořil internetovou prezentaci tohoto sdružení. Chopil jsem se tedy tvorby grafického vzhledu a chodu stránek. Součástí stránek by pak měl být i vnitřní informační systém, do toho se již však nepouštím a nevytvářím jej.
Opět je použito HTML + CSS s prvky PHP. Grafika je opět vytvořená jako jednotlivé obrázky, které jsou nastavené do pozadí jednotlivých divů. Menu je pak vytovřené jen za využití CSS.
ppc Pán Prstenů – Bitva o Středozem ~ http://pp.bitva.cz
Jedním z mála larpů (bitev) na které jezdím je Pán Prstenů – Bitva o Středozem. před pár lety jsem se nabídl, že udělám stránky pro tuto akci. V minulých letech dali organizátoři vždy přednost úplně jednoduchým stránkám – neboli stránky bez jakékoliv grafiky či stylování, zkrátka jednoduché a úplně prosté HTML. Proto jsem se při tvorbě těchto stránek na tuto tradici navázat, a vytvořit jednoduché a přehledné stránky. Grafiku jako takovou jsem omezil také jen na minimum ale tak, aby zde zastoupena byla, byla tematická, a nenarušovala jednoduchý vzhled stránek.
Při tvorbě jsem se opět uchýlil k využití HTML + CSS a prvkům PHP. Grafiku tvoří horní a dolní lišta, mezi kterou je vložen střed. Pod menu se při přejíždění přepínají malé ikonky s vysvětlivkami k jednotlivým odkazům. Pozadí hlavního textu pak tvoří vodokresba nápisu na prstenu.
jixipen Jixipenin svět
tato stránka zůstala pouze ve stádiu konceptu. nebyla nikdy publikována na netu.Ale patří mezi jeden z mých prvních pokusů o samostatné internetové stránky, takže si myslím, že mají i zde své místo.
Stránky jsem tenkrát poprvé postavil na kombinaci HTML + CSS a přidal k tomu volně dostupné horizontální hover menu. Vzhledem k tomu, že nikdy nebyly spuštěny do provozu, tak k nim asi není co jiného říct.
fairy Fairy Horse ~ http://fairyhorse.net
Jednou z těch, kteří zaslechly o tom, že zkouším tvořit webové stránky byla i má kamarádka Lasiríen. Nebo jsem se ji vnutil? Ale ve skutečnosti je to jedno. Zkrátka jsem se uvolil, že ji vytvořím její internetovou prezentaci. Díky této zakázce jsem si uvědomil, že asi nemám rád výtvarníky a umělce. A to proto, že přesně ví jak by stránky měli vypadat, mají to v hlavě a vždy ví, že toto ještě není ono. Zkrátka a dobře vytvoření grafického návrhu trvalo poměrně dlouho, než to bylo to „ono“ jak by to mělo být.
Již klasicky jsem se uchýlil k využití HTML + CSS s prvky PHP. Navíc protože stránky obsahují poměrně dost obrázků, přidal jsem do nich i lightbox. Jedním netradičním prvkem je pak zpracování novinek. Ty jsou zobrazeny na hlavní stránce pouze jako datum. Po najetí se pak objeví plovoucí rámec, kde je samotná novinka napsána. Posledním problémem, na který jsem při tvorbě těchto stránek narazil, bylo implementování knihy návštěv z externího zdroje. Nebylo to způsobeno tím, že bych ji nezvládl napsat, ale naopak přáním zákazníka, který si výslovně přál umístění této knihy na stránky.
mealtiner Mealtiner’s webpage ~ http://mealtiner.net
Když už jsem se vrhnul do tvorby stránek, rozhodnul jsem se udělat si i své osobní stránky. Několik let po sobě jsem využíval různé z webu stažené templaty. Tato grafika stránek je pak moje dílo. Stránky mi sloužili několik let až do momentu, kdy jsem se pak zase jednou rozhodnul pro novej design
Při tvorbě jsem použil HTML + CSS s prvky PHP. Navíc protože stránky obsahují poměrně dost obrázků, přidal jsem do nich i lightbox.
bobravaband Bobrava Band ~ http://band.bobrava.net
V době, kdy jsem působil v tomto bigbandu se objevila potřeba vytvořit nějakou naši internetovou prezentaci. Díky tomu vznikly tyto stránky.
Já už sice v orchestru nehraji, ale stránky přetrvali. Takže se asi podařili a líbí se.
Stránky byly opět vytvořeny v HTML + CSS. Opět s těmi kousky PHP, které používám. Pro menu bylo použito hover obrázků. A samozřejmě pro fotografie jsem se opět uchýlil k využití lightboxu.
bobrava-os Bobrava, o.s.~ http://sdruzeni.bobrava.net
V určitý moment se orchestr potřeboval trochu rozrůst a tak založil občanské sdružení, které mělo pokrýt jeho potřeby. Pro prezentaci tohoto sdružení jsem se snažil vytvořit tyto stránky. V tomto případě mě šlo spíše o přehlednost a jednoduchost.
Stránky byly opět vytvořeny v HTML + CSS. Opět s těmi kousky PHP, které používám. Zbytek jak vidíte je postaven jen na několika divech a jednom obrázku. Zbytek jsou jen vlastnosti css.
zso ZSO – Práce žáků Základní školy Ořechov ~ http://zso.mealtiner.net/
Ještě na gymplu jsem se seznámil s jednou svou dnešní známou, která teď učí na ZŠ Ořechov u Brna. Jedním z úkolů, které na sebe vzala bylo vytvoření tohoto projektu.
Pro mě se nejednalo o nic těžkého. Ve finále, jak je vidět, se jednalo o instalaci redakčního systému a najití vhodného vzhledu pro něj. Vzhled jsem pouze přeložil do češtiny a upravil fotografii na titulce.
Pro mě z tohoto projektu vzešla jediná podstatná výhoda. Naučil jsem se alespoň základy práce s wordpressem.
scaverdreams ScaverDreams
Jednou z dalších stránek, které jsem vytvářel pro své známé byli stránky skupiny dřevěného šermu ScaverDreams. V dnešní době je tato skupina již rozpadlá a stránky nefunkční. Mě z nich zbyl jen návrh.
Opět se jednalo jen o úpravu a editaci volně stažitelného web templatu z netu. Tentokrát jsem zasahoval i částečně do vzhledu a rozmístění některých prvků. A v podstatě jsem předělával CSS layout celého návrhu.
avathar Avathar ~ http://avathar.drevarna.cz/
Další stránkou, které jsem vytvářel pro své známé byli stránky skupiny dřevěného šermu Avathar. Jak se podařili můžete posoudit sami.
Tentokrát jsem jsem našel jeden jednoduchý free template, který mi tentokrát ale sloužil pouze jako mustr, na kterém jsem postavil opět s využitím HTML a CSS tyto stránky. Vycházel jsem z představy, že nejdůležitější věci by měli být vidět. A na druhou stranu, aby to bylo stylové.
logopedka Logopedka.sk ~ http://logopedka.sk/
Je to asi rok co mě oslovil jeden mě neznámý člověk ze slovenska a dohodil mě cca tři či čtyři tvorby webu. ve finále jediné co se podařilo realizovat byly tyto stránky pro Mgr. Lucia Dubravická. Původní návrh stránek se od finální dosti výrazně lišil. Zákazník ale nakonec nadiktoval co chce a tak to dostal. :)
Již klasicky jsem se uchýlil k využití HTML + CSS s prvky PHP.
starydvur čajovna Starý dvůr
Toto byl původní návrh pro stránky mé oblíbené čajovny Starý dvůr v Brně na Mendlově náměstí. Od prvotního návrhu byla dlouhá cesta až k tomuto bodu. Pak se vývoj zastavil. A ve finále se tvorby vzhledu zhostil lépe jeden z mých spolupijců čaje. :)
Již klasicky jsem se uchýlil k využití HTML + CSS s prvky PHP.
supacka Šupácká válka ~ http://supaci.bitva.cz/
Tento návrh vznikl na požádání mého kamaráda, který chtěl udělat jen rychlou vizitku akce, kterou pořádal. Za poměrně krátkou dobu vznikla tato statická stránka. Její další osud je nejistý. Ale mě osobně se líbí.
Tato stránka je udělaná čistě staticky v kombinaci toho nejjednodužšího HTML za pomoci CSS.
brkko BRKKO ~ http://brkko.cz/
Další web, který sem postavil nba redakčním systému wordpress. Nejtěžší na jeho tvorbě byla nejspíše diskuze s členy brkka o tom, který free template se má použít. Opět pak následoval překlad tohoto templetu do českého jazyka a jeho částečná úprava. Členem BRKKa je i Lasirien, které jsem vytvářel stránky Fayrihorse (viz. výše) a tak mě požádala i o tento návrh.
Součásti tototo projektu byla i tvorba loga (pero) umístěného v hlavičce stránek. Jednalo se o překreslení seskenovaného ručně kresleného návrhu do vektorů pro použití pro tisk a také následný převod do pixelové grafiky pro použití zde, na webu.
Tyto stránky jsou postavené na redakčním systému wordpress a několika jeho pluginů. Z toho některé jsem překládal do českého jazyka. K webu patří i diskuzní forum, které je postaveno na jiném systému a ke kterému jsem se snažil přidružit stejný grafický vzhled.
revelband Revelband ~ http://revelband.mealtiner.net/
Jeden z mých posledních návrhů pro kapelu kterou se svým způsobem pokouší řídit má nejdražší sestřička. Stránka odpovídá požadavkům členům tohoto uskupení, kde byl kladen důraz na případnou editaci od lidí, kteří si s html kodem moc nerozumí.
Stránky byly vytvářené pod psychyckým nátlakem (uvaření večere – guláš z divočáka) jednoho pěkného lednového večera, když jsem se náhodou objevil u nás doma. Ale ve finále si myslím, že se nepovedly úplně nejhůř.
K tomuto návrhu patří také vypracování návrhu loga této kapely, které můžete opět spatřit v hlavičce stránky.
Stránky byli opět postavené s využitím HTML + CSS s prvky PHP (načítání externích txt souborů, které si mohou editovat členové kapely). Na stránkách je také využit lightbox pro prohlížení fotografií.
supaci Šupácká válka ~ http://supaci.bitva.cz/
Pokud máte pocit, že tyto stránky tu již byli, tak máte pravdu. Ale po dvou letech existence stránek jsem byl požádán o jejich přetvoření do nového kabátu.
Snažil jsem se opět zachovat jednoduchost a přehlednost stránek. Od zadavatele byl požadavek, aby stránky měli podzimní nádech. Snad jsem to vycítil správně.
Stránky byli opět postavené s využitím HTML + CSS s prvky PHP