LétajícíMoucha.cz

aneb blog jednoho grafika…

Práce – netopeer.sk

Únor 22, 2013 Moje práce

Mezi další práci lze zařadit grafický návrh stránek pro herní portál netopeer.sk. Netopeer.sk se zabívá již několik let provozováním kvalitních a hojně navštěvovaných San Andreas Multiplayer (SA-MP) serverů. V zadání bylo napsáno, aby to mělo klasické rozložení portálu. Já jsem si ale řekl, že klasické portály už jsou dneska poměrně nudné a návštěvníka ničím nezaujme. Tak jsem udělal trošku jiné rozpoložení stránky a na výsledek se nyní podíváme a trošku si ho i popíšeme.

Pozn.: Všechny náhledy stránek byly zmenšeny z šířky 1920x1700px na 1280x1133px.

Návrh loga

Účelem bylo vytvoření jednoduchého loga, které bude výrazné – na první pohled poví, o čem projekt je. V tomto případě o hrách. Hlavní herní prvek v logu jsou právě ony herní šipky, které se nachází na herním ovladači. Zbytek už je jen název projektu a titulek. Myslím si, že výsledek se ke grafickému návrhu stránky hodí.

 

Hlavní stránka

Nyní se dostávám k tomu nejhlavnějším – úvodní stránka. Chtěl jsem vytvořit rozložení a grafické zpracování, které se jednoduše až tolik často na herních portálech nevidí. Zvolil jsem tmavé barvy, které ve spojení s krásnou zelenou barvou dokonale sedí.

Headerovou část jsem v tomto návrhu mohl konečně pořádně využít. Nejenom že tam najdete logo, ale i aktuální status serverů, online hráčů či registrovaných hráčů. Mimo to tam nalezneme i přihlašovací / uživatelský panel. Vy zde můžete vidět, jak panel vypadá po přihlášení. Každý uživatel má možnost se okamžitě dostat na svůj profil a následně upravit, či shlédnout nové soukromé zprávy (SZ). Osobně se mi líbí prvek s číslem nových SZ.

Menu je jednoduché a výrazné, který je navíc doplněný i o submenu. Napravo se byť ne příliš výrazně ukrývá šikovné vyhledávání.

Hlavním viditelným prvkem je “slider” s hlavní novinkou. Ta dominuje jedním velkým obrázkem, ve kterém jsou vložené informace jako název článku, krátký popis a autor článků. Napravo od tohoto obrázku najdeme již “výstřižek” textu tohoto článků i s jeho titulkem. Dále tam máme i kolikrát byl článek zobrazen či komentován – doplněné stylovým buttonem pro přečtení celého článku.

Pod touto “slider” částí se nachází tři “okna”, kde najdeme seznam serverů, něco o projektu a poslední komentáře. Původně místo “něco o projektu” jsem měl “Proč hrát u nás”. Důvody byly podobně řešené, jako poslední komentáře. Každopádně zákazník se rozhodl tuto věc vyměnit za právě zmiňovaný “něco o projektu”.

Dále tu máme novinky, které jsou také podobně stylizované. Využil jsem možnosti velkého prostoru a udělal jsem to na dvě novinky v řádku. Úžasně se tím vyřešil prostor. U všech novinek je k dispozici výrazný button pro přečtení kompletního článku.

Už se pomalu dostáváme k posledním částem, mezi které patří – no vlastně ani nevím jak to popsat. V Photoshopu to mám popsané jako “spodek”, tak tomu tedy říkejme spodek. Tam naleznete tři základní věci, které by určitě neměli na žádném portálu chybět. Reklamy, videa a facebook. Zvláštnost tohoto spodku je ta, že je spojená s footerem a vyčnívá z něj dovnitř do obsahu. Vizuálně to tedy je jakoby napojení na výše zmiňovaný “slider”, který má také podobný základ.

A jako poslední máme samotný footer. Ten je relativně obrovský, neboť je ještě spojený s prvkem popsaný výše. Najdeme tam logo projektu, copyright, textové menu, odkazy a logo studia.

Celá stránka je dle mého názoru dobře barevně sladěná – byť by možná některé části chtěli zesvětlit. Žádný z prvků nijak uživatele neoslňuje a vše působí uceleně a plně.

 

Obsah stránky

Jako další zadání bylo vytvoření obsahové části stránky. Na tomto návrhu vidíme stránku pro jeden z herních serverů. “Slider” z hlavní stránky se nám trošku změnil. Nyní plní jinou funkci, a to popsat daný server. Pod ním už máme rovnou obsah, vyznačený mírně šedou tabulkou. Tam je připravený prostor pro vložení iframe okna, kde bude například seznam online hráčů na daném serveru. Vedle této šedé tabulky najdeme panel s menu, který slouží pouze a jen dané sekci se serverem. Obrázky u každé položky byli převzaty z původní stránky projektu. Zbytek už je klasický.

 

Obsah novinek

Vytvořit podobu pro novinky byl pro mne opravdu velký oříšek. Vůbec mě nic nenapadalo, jak bych to mohl vytvořit. Každopádně výsledek dopadl jak dopadl. Nic úžasného na něm nenalezneme. Původně jsem měl vytvořenou ještě jinou verzi, která není tak jednoduchá a nic neříkající, každopádně mi bylo řečeno, že chtějí něco hodně jednoduchého a obyčejného. No a tak se tedy i stalo.

 

Výsledek

Celá stránka je dle mého názoru dobře barevně sladěná – byť by možná některé části chtěli zesvětlit. Žádný z prvků nijak uživatele neoslňuje a vše působí uceleně a plně.

Abych se přiznal, stránku takového stylu jsem dělal úplně poprvé a myslím si, že to vůbec nedopadlo zle. Zákazník byl plně spokojený a vše probíhalo bez problému. Jen mě mrzí trošku ten obsah novinek, který není tak jak bych si představoval. Každopádně co jsem koukal, tak si to zákazník při kodování ještě poupravil podle sebe. Takže ty novinky jsou po úpravě mnohem lepší. No nic, doufám že se vám “rozbor” líbil (pokud jste byli taky dobří, a přečetli to celé) a byl bych moc rád, kdyby jste okomentovali či sdíleli, jak vidíte tuto práci vy.

Napsat komentář