Projektová skupina správy a rozvoje portálu Praha6.cz během roku 2011 postupně vypracovala a nechala si vedením radnice schválit zde uvedené, velmi podrobné a konkrétní Zadání grafické modernizace portálu Praha6.cz
Již proběhlé fáze projektu modernizace:
do 25.10.2011 rozeslání zadání vytipovaným grafickým studiím (celkem 15, s tím že jen 6 potvrdilo zájem zúčastnit se)
do 20.11.2011 odevzdání nabídek obsahujících všechny požadované náležitosti
dne 29.11.2011 se sešla Projektová skupina za účelem vyhodnocení nabídek; s ohledem na to, že nakonec byla podána pouze jediná nabídka, musela Projektová skupina zvážit další postup; po analýze důvodů vedoucích k tak slabé účasti grafických studií bylo rozhodnuto uspořádat "druhé kolo" poptávky s tím že bude zadání doplněno o některé další informace, bude prodloužen termín na odevzdání nabídek (viz. Postup realizace níže), počet vytipovaných grafických studií bude rozšířen o pět dalších, všichni budou znovu osloveni a zadání bude publikováno na webu tak aby se mohli zúčastnit i případní další zájemci
Nyní je tedy níže uvedené zadání rozšířeno a doplněno a případní zájemci tedy mohou do 31.1.2012 do 29.2.2012 (termín byl prodloužen) zaslat své nabídky na adresu webmaster{zavináč}praha6{tečka}cz
Základní údaje
Nová grafika webového portálu ÚMČ Praha 6
Hlavní požadavky
moderní design s předpokládanou trvanlivostí 2 roky
zjednodušení a zatraktivnění ovládání (piktogramy, nové ovládací prvky, přehlednost, intuitivnost)
atraktivní úvodní "dvojstrana", která svou interaktivitou vtáhne návštěvníka do "hry" (viz níže)
zohlednění všech doporučení eMerite (viz. příloha Periodické analýzy eMerite)
vyhledávání - pro nás dominantní prvek, naše technické řešení považujeme za špičkové; chceme vyhledávání protlačit jako hlavní způsob hledáni na portálu, je ale možné tento prvek vřadit i jinam
tlačítka (piktogramy, bannery) našich mikrowebů (viz. níže)
rozdělení na dva hlavní tématické bloky pomocí obřích záložek (MČ - do modra a ÚMČ - do červena viz. "vlajka městské části" a viz. příloha "menu"); podobně jako www.praha2.cz
úvodní záložkové (roletové) menu s možností rozbalování (různé pro každý z obou tématických bloků + ctí barvu bloku)
roletové menu budeme generovat dynamicky bylo by proto vhodné počítat s tím že některé nadpisy mohou být delší a nejlépe i s tím že "1. úroveň" menu bude celkově tak dlouhá že může přetéct (zalomit se) do druhého řádku
ideální by bylo např. menu jako na www.mall.cz kde se nižší ůrovně rozbalují hezky do více sloupců
současné menu bude tedy rozděleno na dvě samostatná a dále mírně modifikováno; ranný návrh tohoto rozdělení je uveden v příloze
bílý prostor pro vlastní obsahovou část stránky
titulní dvojstrana (MČ a ÚMČ)
prvním prvkem na každé z úvodních dvoustran bude blok "hot news" s variabilním počtem zpráv kde se budou jednotlivé zprávy střídat libovolným plynulým pohybem (řešení buď jako "Nejlepší příspěvky" na www.androidmarket.cz/ nebo jako "Top news" na www.bbc.co.uk/ případně netradičně jako obdobný prvek v www.pixelthemestudio.ca/); tento prvek může zabírat 1/2, 2/3 a nebo celou šířku strany
zbytek titulní stránky bude možno uživatelsky upravit nastavením gadgetů (jako např. www.igoogle.cz )
plovoucí prvky (gadgety) budou uspořádány do dvou nebo tří stejně širokých sloupců
u gadgetů bude možné administrátorem nastavit některé vlastnosti (a jejich kombinace) přiřazením stylu:
pevné - nelze měnit umístění
povinné - nelze minimalizovat
volba počtu položek v prvku (např. počet Aktualit) tlačítky +/- v záhlaví gadgetu (řešeno ihned AJAXem)
barevnost/zvýraznění
příklady gadgetů
aktuality (nadpis, perex, datum, oblast, obrázek,...) a u ostatních prvků níže velmi podobně
akce
úřední deska
štítky
facebook
youtube kanál
kalendář zasedání
kalendářík měsíce s možností zvýraznění dnů
upozornění
anketa
elekronické služby
"nepřehlédněte"
textová reklama
přihlášení k odběru
naposledy navštívené stránky
poslední hledání
počasí
... a další viz. současná titulní strana
běžná strana - sestavena z bloků (nastylované texty)
drobečková navigace zcela nahoře
vlastní obsah stránky sestavený z grafických bloků (viz. Grafický návrh níže)
na stránkách kde to bude nutné by mělo být možné nezávisle na sobě vložit:
vlevo lokální svislé menu opět s možností rozbalování podúrovní (zde stačí jen jedna úroveň); toto menu by mělo být snadno stylovatelné do různých barev (odstínů) pro lepší orientaci návštěvníků o tom kde se nyní nacházejí (např.www.vacuclean.cz/produkty.htmlvs. www.vacuclean.cz/aplikace.html)
vpravo sloupec s dalšími informacemi rozčleněnými do bloků / plovoucích okének, které se budou řadit pod sebe na pravou stranu; mohou obsahovat např. odkazy na příbuzné články; zvážit zda by se zde mohly zobrazovat i vybrané gadgety z titulní strany; zvážit zda tuto okénka bude text obtékat či zda se v případě použití okének zúží prostor pro hlavní text v celé délce stránky
bezpatkové fonty; nadpisy min. H1-3; několik tříd různých zvýraznění (pro použití v bloku textu přiřazením stylu)
prostor a umístění tlačítek mikrowebů umístit co nejvýše (www.jakdoskoly.cz, www.jakdoskolky.cz, www.snehovapohotovost.cz, www.sestka.cz a další viz. příloha Nová struktura menu a Mikroweby) Zkuste případně navrhnout vlastní, graficky sjednocující piktogramy pro mikroweby. Počítejte s tím že další mohou přibývat.
prostor pro "vlaječky" jazykových mutací zhruba v současném počtu
ikony, piktogramy a oživující grafické prvky; piktogramy s jednotným rukopisem (a nejlépe i s decentním "hoverem") pro:
všechny elektronické služby
nejpoužívanější sociální sítě/služby
homepage
zpět
nahoru
email
přeposlat emailem
editovat
vytisknout
kalendářík
hodiny
vykřičník
otazník
důležité
... případně další
nastylované grafické bloky ze kterých budou jednotlivé strany sestaveny (styly níže uvedených prvků budou v samostatném souboru)
název strany (H1) + perex
název sekce (dnes tmavě šedý proužek s bílým textem velkými písmeny) obsahující html záložku (#bookmark)
oddělovač bloků (něco jako HR)
nadpisy (H2,...)
lišta(y) s výběrem "podskupin" nyní umístěná(é) pod počtem nalezených záznamů (např. www.praha6.cz/aktuality/)
lišta(y) umožňující volit jednotlivé stánky nalezených záznamů (např. www.praha6.cz/aktuality/ zcela dole)
gadgety budou serveru předávat své nové pozice (nastavení) pomocí JQuery (AJAX) tak, aby bylo možné ukládat aktuální stav pro každého návštěvníka; serverovou část si řešíme sami
gadgety budou při uživatelské interakci načítat nový obsah pomocí JQuery (AJAX); serverovou část si řešíme sami
přístupnost - pokud možno splnit požadavky
WCAG 2.0 (rámcově s přihlédnutím k současným požadavkům a technice)
stránky obce které obdržely první cenu za přístupnost na konferenci ISSS (zkuste např. verzi pro slabší zrak); velmi dobře kódované html i css - http://www.trebihost.cz/
zajímavý dynamický prvek v záhlaví, který by byl zajímavý i pro použití jako naše "hot news" - http://www.pixelthemestudio.ca/
barevné pruhy přes celou šířku, piktogramy/ikony, struktura (zjednodušení běžných stran) - http://demo.templateworld.com/universal-css-templates/m-18062010a/ (ideálně v takovéto podobě bychom chtěli obdržet finální soubory pro redesign našeho portálu - viz. menu OPTIONS a GALLERY tohoto odkazu)
Nová struktura menu a Mikroweby
ÚŘAD a SAMOSPRÁVA (záložka, menu a doplňková barva stránek červená)
Analýza eMerite - 2005 - Praha 6 [ PDF • 980kB ]
Analýza eMerite - 2006 - Praha 6 [ DOC • 1874kB ]