Posterous theme by Cory Watilo

Uvidíme se na mobileDevCampu

V sobotu brzo ráno vyrážím z Pardubic na mobileDevCamp, kde budu hájit barvy Inmitu :-). Na akce tohodle typu se těším, protože se setkám s lidma, ze stejného oboru (a taky z práce :)). Většina přednášek je zaměřených čistě pro programátory (čest vyjímkám), proto bude dostatek času pro na různé diskuze.

Rád bych se na téhle akci potkal s dalšími mobilními grafiky, sednul k jednomu stolu a přátelsky poklábosil a nástrojích, stylech, inspiracích, které ve svých pracích používáme. V případě zájmu rád taky mohu hodit feedback na nějaké uživatelské rozhraní nebo grafiku. Takže se nebojte a vemte si skicy :-). Nejsem žádný guru nebo kmet v oboru, ale nějaké zkušenosti jsem už posbírál a rád se s nima podělím. Plánuju se zdržet i na afterparty, hospodské tlachání si zkrátka nesmím nechat ujít. :-)

Kontaktovat mě můžete na:

feltl.michal@gmail.com  |  sms: 774238239  |  twitter  | google+

Takže naviděnou v sobotu!

 

Jsem v Inmite

Po skoro roční externí spolupráci jsem se dnes stal zaměstnancem firmy Inmite. Po dlouhé době cítím zase elán a radost z toho, že budu moct dělat na fulltime to, co mě baví nejvíce - navrhovat rozhraní a kreslit design mobilních aplikací. Do dnešního dne jsem fungoval 8h v klasickém zaměstnání a 4-5h externí spolupráce na ŽL. Práce 12-13h denně je vyčerpávající. Takže to chtělo změnu.

Po 4,5 letech jsem ukončil pracovní poměr ve společnosti Foxconn, kde jsem pracoval na pozici procesního inženýra. Kompletně měním obor svého působení a vrhám se do nových vod. Sice se grafice věnuji cca 3 roky, ale i tak to bude pro mně výzva. Inmite je svobodná firma. Není to firma, která se jen o svobodu snaží, ale u nich to opravdu funguje už od začátku. Před svým nástupem jsem měl možnost se seznámit s většinou lidiček, kteří v této firmě pracují a to hlavně díky různým akcím, na kterých jsme se nezávisle střetávali (konference, hackathony, teambuildingy...). Takže možná stejný zájem nás dal dohromady. Na Inmite se mi líbí otevřenost, důvěra, vzřícnost, volnomyšlenkářství, ale také chytrost, vzdělanost a zkušenosti. Pracují tu opravdu odborníci a já se těším, jak budu jejich zkušenosti vysávat a naopak jim budu moct nabídnout něco svého.

Pracovat ve svobodné firmě není pro každého. Člověk si musí vytvořit vlastní řád a být k sobě sebekritický. Důležitým faktorem je zodpovědnost. Ono se hrozně dobře poslouchá, že člověk může pracovat doma nebo odkudkoliv na světě a v jakoukoliv hodinu. Ale celé to působení zaměstnance musí pro firmu dávat smysl. Nesmí to být vyhozené peníze. Je potřeba se orientovat na kvalitní výsledek a pomáhat firmě v růstu a stabilitě. A na to se těším.

Živnostenský list si se svolením firmy ponechávám, takže svojí externí činnost neukončuji. Nadále v případě zajímavých nabídek si občas vezmu nějakou externí zakázku. Já vím jsem blázen, ale mně to opravdu baví. :-)

Howgh.

Google play - download button

Pokud jste poslední týden nechodili kanálama nebo nelítali po oběžné dráze, tak Vás určitě neminula zpráva o přejmenování Android market na "Google Play".

Proč se tomu tak stalo, nechci nijak dlouze rozebírat. Ale jen v krátkosti nakousnu, co si o tom myslím já. Hlavní důvod vidím v rebrandu, firma chce tlačit název celé značky "Google" a ne jen jeden produkt "Android". Market totiž mohou využívat i lidé, kteří Android nevlastní (hudba, filmy, knihy). Dalším důvodem je chtíč se odlišit se od konkurence a odprostit se od známých (běžných, nudných..) slov jako je market, store, marketplace atd. Načasování bylo podle mého názoru také záměrné. Google nechtěl, aby veřejnost ubírala svůj zrak jen na Apple a jeho keynote o novém iPadu.

Google-play-btn-download

Pro jeden aktuální projekt jsem potřeboval vytvořit na micrositu download tlačítko pro Android market. Ha, ale on už neexistuje, je to Google Play. Takže jsem byl nucen jít prozkoumat vody a zkusil jsem takové tlačítko navrhnout. Výsledek můžete posoudit sami a co víc. Dávám tlačítko v normal a pressed stavu volně ke stažení. Můžete ho používat pro svoje microsity, weby, fb aplikace atp. A to i pro komerční účely.

Ať slouží.

Tlačítko Google Play ke stažení:

7z archive nebo RAR archive

Global Android devCamp Prague a Harvester

Je to jen pár hodin, co skončila akce s názvem Global Android DevCamp, která se konala po 30 městech v různých zemích. Na poslední chvíli se podařilo GUG.cz zorganizovat i v ČR, konkrétně v Praze. Neodolal jsem a na akci jel. Těšil jsem se, že si pokecám s lidmi, se stejným zájem (vývoj mobilních aplikací), a že vyměním nějaké ty zkušenosti. Celé to bylo o tom, že 4 členné týmy měli 48 hodin na vymyšlení a naprogramování aplikace na Android. 

Android_map_ressource_72dpi

Akce se odehrávala v coworkingovém centru The Hub, kde jsem byl poprvé. To místo na mně udělalo velmi dobrý dojem. Dobře vybavené centru, super bar, pojízdné stolky, silný signál na wifi, voda zdarma :) a další drobnosti, díky kterým se člověk cítil dobře. Přemýšlím, jestli bych dokázal pojmenovat něco, co mi na těch prostorech vadilo, ale nic mě nenapadá. Jen snad malý počet síťových zásuvek ve stolech… fakt drobnost.

Ale k samotné akci. Na začátku jsme měli za úkol vytvořit 4 členný tým. Byl jsem sám, znal jsem osobně jen mentory :). Po příchodu jsem si sedl ke stolu, kde bylo místo. Seděl u něj Pavel z Brna. A bylo jasno, už jsme měli tým o dvou lidech. Z Pavla se vyklubal dobrý backendista na Drupalu a zvládl i rozjet a plnit naší projektovou micrositu. Po chvilce nás oslovili dva kluci z vedlejšího stolu a vytvořili jsme 4 členný tým. Měli jsem ideální sestavu. Honza byl Android developer a Zbyněk backendista na .Netu (a zároveň programátor na iOS). Viděli jsme se poprvé v životě.

Img_1315

Hackathon začal. Nasdíleli jsme si mezi sebou google doc soubor a začali dávat dohromady nápady, co bychom mohli dát do kupy. Nakonec jsme se odvážně pustili do mého nápadu: jakési sociální sítě na výměnu zájmových kartiček. Jestli jste v dětství sbírali hokejové kartičky, pokémony, turtles ninja, nebo obrázky z Pedra, tak jste naše cílová skupina. Měli jsme představu mobilní aplikace, ve které bude mít uživatel po registraci album, do kterého si bude zakládat kartičky. Ty získává za to, že se pravidelně (denně) loguje do aplikace. Kartičky mají různou hodnotu – máme běžné karty, neobvyklé a "rare" (vzácné) - ty mají velmi malou pravděpodobnost, že je uživatel získá. Takže nápad byl na světě. Čekalo nás hodně práce.

První den - tedy v sobotu jsme začali s návrhem nějakých základních skic na papíře a já začal rozkreslovat první designy v Adobe Fireworks. 4 hodiny jsme se sekli nad UI/UX, kdy jsme řešili, zda bude lepší pro uživatele album swipovat horizontálně nebo vertikálně :-). Mezitím Pavel zvládl připravit backend v Drupalu. Zbytek dne začal Honza programovat podle základního návrhu aplikaci na Android. Nakonec jsme od Drupalu ustoupili a nastoupil Zbyněk s .Netem. Takže se nikdo nenudil. Já zvládl  zkreslit 3 základní screeny, které dávali smysl. První den jsme toho zvládli v celku dost, ale to jsme ještě nevěděli, na jaké dno si sáhneme druhý den.. 

Harvester. Tak jsme pojmenovali naší appku. Pamatujete si na hru Dunu 2? Tak přesně ten stroj,  co sbíral koření se jmenoval stejně. Jinak obecně se nám to jméno líbilo, je originální, dobře se vysvětluje a má alespoň trochu nějaký význam, dle překladu je to „sběratel podivuhodností“ :-). Zpět na Hackhathon. Po večerním tahu v hospodě bylo ráno, jak z jiné planety, ale po dobrém kafi jsme nastartovali metabolizmus a začalo nám to zase šrotovat. Já kreslil, Honza pracoval na appce, Zbyněk dodělával backend v .Netu, Pavel připravoval naší propagační micrositu. Čas docela rychle utíkal. Řezat resources z designu jsem začal 3 hodiny před koncem, Honza pak stylovat appku poslední hodinu. Jeli jsme na maximum a využili opravdu poslední minuty. Ikonu appky jsem kreslil 15min před koncem a Honza jí stihl ještě implementovat.. Těsně, než jsme šli prezentovat projekt, jsem ještě rychle sepsal něco, co budu povídat. Honza otestoval, že funguje přihlášení dvou uživatelů a je možné si v appce vyměnit kartičky. Prezentace byla nemastná - neslanná, já se zadrhával, byl jsem vyčerpaný a nervózní, ale Honzovi se povedla ukázka na jedničku. Uff a měli jsem to za sebou.

Pak se hlasovalo. Každý napsal na papírek, který tým si myslí, že byl nejlepší. Organizátoři spočítali hlasy a po dobré přednášce Michala ze StartupYardu se oznámili výsledky v tomto pořadí:

  • 9 misto: Occupy Dev Camp
  • 8 misto: NameDay Reminder
  • 7 misto: Message Timer
  • 6 - 5 misto: Geocaching, LookAround
  • 4 misto: CeliDB
  • 3 misto: Gorillaz
  • 2 misto: Project Manhattan
  • 1 misto: Harvester

Ano. Vyhráli jsme. Abych pravdu řekl, na výsledek jsme se po celou dobu nesoustředili, naší motivací nebylo vyhrát. To, co nás hnalo dopředu byla vidina, že opravdu zvládneme za pár hodin vyrobit funkční aplikaci, která bude postavená na dobrém nápadu. A to se nám povedlo. Odjížděli jsme se skvělým zážitkem a dobrým pocitem, že jsme to zvládli. Cestou domů vlakem jsme si každý naší appku nainstaloval a celou cestu jsme si mezi sebou měnili kartičky :-). Paradoxně jsme zjistili, že 3 členi týmu jsou z Pardubic a Pavel je z Brna. Vývoj Harvesteru bude pokračovat, jen si chceme dát pár dnů / týdnů oraz a podívat se na náš nápad s odstupem času.

Za první místo jsme vyhráli 1ks iPod Nano 8Gb, což se docela blbě dělí mezi 4 lidi :-(. Moc jsme nepochopili, proč zrovna je hlavní výhra konkurenční produkt? Asi proto, že Android už umíme a máme zkusit programovat pto iOS? Každopádně všem děkujeme za hlasy, co nám dali.

Harvester jsme přihlásili do globální soutěže, tak nám držte palce.

Uff. Dostal jsem ze sebe dojmy a jdu konečně spát.

 

Užitečné nástroje #3 - Nine-patch generátor

Dneska se podíváme na nástroj, který opravdu ulehčuje život Android vývojáře. Dobré je, že tahle utilita je vhodná jak pro designéra, tak stejně dobře její sílu může využít i programátor, který si třeba grafiku sestavuje sám.

Pokud už z nadpisu nevíte co jsou nine-patches, tak doporučuji prostudovat tuhle kapitolu z Android DevGuide. Obecně se dalo říci, že se jedná o PNG obrázek, který má na sobě markery, které definují to, kde a jakým způsobem může být daný obrázek roztahován (např. tlačítko s kulatými rohy) a pokud je potřeba, jak v daném obrázku bude zarovnané písmo (padding).

Nine-patch generátor je webový nástroj od googlera Romana Nurika.

Funkcionalita je jednoduchá. V source image si vybere obrázek, ze kterého chcete udělat nine-patch. Typicky si tedy nejprve v nějakém grafickém programu nakreslíte obyčejné PNG (třeba to tlačítko) a vložíte ho do generátoru. Vyberete densitu, ve které je dané PNG nakreslené (z vlastní praxe kreslím vždy pro nejvyšší rozlišení, ale není to podmínka). Určíte jméno, generátor pak při výstupu přidá koncovku (.9.png). A v pravé části již nastavujete jednotlivé markery pro  Stretch regions a  Content padding (ten není povinný). Dole je vidět, jak vypadá výstup ve všech densitách. Ve chvíli, kdy jste s výsledkem spokojení, tak si můžete stáhnout zazipovaný soubor, ve kterém pak najdete (v nativní adresářové struktuře Android resources) jednotlivé 9-patches.

Dříve jsem kreslil nine-patches v rozřezové šabloně pro každou densitu zvlášť, což zabere vždycky hromadu času (rozscalované markery, opravování délek apod.). Nyní se maximálně snažím využívat tenhle nástroj. Jedinou nevýhodu v generátoru vidím tu, že pokud upravuji styl třeba všech tlačítek, opět musím udělat všechny 9-patche přes generátor. Takže je potřeba přemýšlet, zda prvek, ze kterého budu dělat 9-patch má finální podobu nebo se bude ještě upravovat (jiný styl, tvar, velikost).

 

Je Fireworks lepší než Photoshop?

Alibistická odpověď by zněla: "jak pro koho". Pro mě jednoznačně ano.

S Adobe Fireworks CS5 pracuji denně již necelé 3 měsíce, takže mohu za sebe objektivně říci, že je pro mně lepším nástrojem než byl Adobe Photoshop. Nepřešel jsem ještě úplně, protože se musím občas vracet ke starším projektům, ale nové věci řeším výhradně přes FW. Díky tomuhle switchování mezi PS a FW si dokonale uvědomuji rozdíly mezi jednotlivými programy počínaje klávesovými zkratkami, až po celý systém práce.

Ve Photoshopu jsem kvůli datové velikosti musel řešit každou stránku webu / screenu jako jeden PSD soubor, ve FW mohu využívat stránky v jednom souboru a nejen to, mohu definovat i různé stavy na jedné stránce. Nemusím kopírovat vrstvy z jednoho PSD souboru do druhého, ve FW si je dávám sdílet do stránek a stavů. Elegantní řešení, které zvyšuje efektivitu a přesnost. Pokud mám 1000 vrstev, tak ve FW mi PNG zabírá maximáln 10Mb a PSD ve PS 200Mb.

FW i PS jsou aplikace, které občas spadnou a pak je práce v háji. Tomu se asi nevyhne žádný designér. Nevyřeší to ani nabušená mašina s rychlým procákem a 16GB ramek. Respektive pomůže, ale i tak občas aplikace spadne. Rozdíl je v tom, že obě aplikace padají jinak. Photohop se zasekne a ihned se odstřelí z procesu. Fireworks vypíše hlášku, že má nedostatek paměti a pak se hodí do stavu, kdy se dá chvílemi ovládat, to znamená že umožní v této chvíli "uložit / uložit jako". Pak nezbývá, než aplikaci odstřelit a pustit znovu. Samozřejmě ideální řešení je, aby aplikace nepadali vůbec, nicméně FW má ten pád vyřešený "elegantněji".

Ve FW pracuji na 90% s pravými vektory. Mohu nakreslit obdélník s oblými rohy, roztáhnout ho tak, abych si nezničil poloměry rohů. Mohu jednoduše zadávat přesnou délku a výšku v px. Mohu využívat metodu 9patch pro roztahování a zmenšování jednotlivých prvků. Díky této metodě si určím, v jaké části má být prvek natahován a při zvětšování si nezničím třeba logo. Na vrstvu mohu aplikovat třeba 5 vržených stínů, pod jiným úhlem a jinou intenzitou, aniž bych jí musel duplikovat. A Photoshop? Musím zápasit s maskama, svazovat vrstvy a nebo je slučovat destruktivně.

Ve FW vrstvy mohu seskupovat a zase rozdělovat jednoduše. Zkrátka si je naklikám na plátně, zmáčknu klávesovou zkratku a mám grupu. Dokonce v seznamu vrstev vidím i kolik je ve skupině vrstev. Každá vrstva může mít svůj styl (přechod, stín, šum, tah apod.). Pokud vrstvy seskupím a zase rozdělím, ponechávají si svůj styl.. wow! A co víc. Mohu dokonce třeba na grupu 100 vrstev aplikovat jeden styl. Tohle prostě Photoshop neumí.

Na konec zmíním spíš už jen takové perličky. FW umí jednoduše kopírovat vrstvy přes Ctrl+C / Ctr+V a přes klávesovou klávesovou zkratku kopírovat styl z jedné vrstvy na druhou.. Ve Photoshpu se musím hrabat v seznamu vrstev a složitě duplikovat vrstvu, kopírovat a vkládat styl přes kontextovou nabídku. Možná, že tyhle věci jdou ve Photoshopu taky někde nastavit, ale nepodařilo se mi to objevit. Další perla je to, že FW pracuji stále s vektory, takže pokud se rozhodnu v půlce projektu, že upravím styl všech oblých rohů na tlačítkách, tak změním jen 1 parametr u každého tlačítka a nemusím znova vrstvy překreslovat. Ve FW se neperu s půl-pixely, mohu pracovat přesně na "pixel-perfekt" a to (nejen) díky klávesové zkratce Ctrl+K, která pomůže, při ruční změně velikosti nějaké vrstvy, půl-pixely změnit na celé pixely. A třeba Řezy jsou na vlastní kapitolu. Stačí jen dodat, že se chovají jako vrstvy (jednoduchá změna velikosti, kontrola nad velikostí, žádné čáry přes celé plátno jako v PS).

Tímto článkem nechci hanit Photoshop. Spíš je to takové shrnutí toho, co mi přinesl Fireworks, a proč je pro mě jako designéra lepším nástrojem než PS. I Fireworks má ale svoje slabá místa, jako je třeba úchylný rozměr panelu vlastností, který nejde jinak modifikovat. Nebo omezené nástroje pro práci s bitmapou (nahrazování barev, odbarvování, křivka a úrovně barev, vyplňování obsahem..). Photoshop je skvělý program, který by těžko asi třeba fotograf vyměnil za Fireworks. Ale přijde mi, že pro designéra, je to neobratný dinosaurus, který je nadupaný nástroji pro práci s bitmapovou grafikou, které využije tak z 10%. Což ho bohužel ovlivňuje a doplácí na to v těch 90% designérské práce.

A na závěr jeden skvělý odkaz na důvody "Proč" a zdroje pro FW.

http://www.isfireworksbetterthanphotoshop.com/

Pár slov k "Android design guide"

To bych snad nebyl ani já, abych se taky nezmínil a přidal k tomu svůj názor a jaký z toho mám pocit.. 

Včerejším dnem 12.1.2012 vydali googleři, v čele s Matiasem Duartem, webovou příručku o pravidlech tvorby grafického designu na platformu Android. Příručka pojednává pouze o nové verzi systému Android 4.0 (Ice Cream Sandwich). Což je jasným znamením toho, že by Google nejspíš rád zapomněl na starší verze 2.x a věnoval se pouze ICS. Z pohledu vývojáře je to dobrý krok pouze za předpokladu toho, že to za rok nebude jinak.. :-), jako jsme byly zatím na Androidu zvyklý...

Určitě je tu velký prostor na diskuzi, zda má nebo nemá smysl převádět stávající aplikace do ICS designu. Překlopení designu u náročnějších aplikací je vcelku drahá a časově náročná činnost.. v některých věcech se totiž jedná o kompletní překopání celého uživatelského rozhraní..., které většinou začíná někde na skicáku... uff :-). Jako velký problém vidím v tom, že ani sám Google nedokáže ukočírovat design svých aplikací... a to jak nových, tak update těch stávajících.. Jako příklad by se dal uvést Gmail, Google+, Google Docs, Gtalk, Youtube atd. Naprostý chaos a bezvládí v dodržování vlastních guidelines :-(

Co si z toho mají odnést vývojáři? Máme se řídit novými guidelines? nebo pro každou verzi OS vytvářet specifický design UI a ten povolovat na určitých zařízeních? Bude ICS design dodržován i pro nové platformy jako je třeba Google TV? No kdo ví :-). Smartphonů a tabletů s ICS je poskrovnu... z mého pohledu má smysl ještě čekat na to, až se ICS rozšíří po více zařízeních, případně si zkusit navrhnout nějakou první vlajkovou loď a zhodnotit, jaký bude mít ohlas...

Jak to vidíte Vy?

Prodám HTC Desire HD + hromadu příslušenství

Telefon je už prodaný.

S novým rokem, nový telefón :-). Takže aktuálně prodávám a svůj stávající HTC Desire HD mám na prodej.. Velká výhoda je ta, že mám k tomu hromadu příslušenství, které jsem během toho roku nasbíral :-)

Prodám: HTC Desire HD, stav zachovalý, fotky jsem pak dodatečně dodám

Image

Ofic. specka:

Recenze:

Záruka je platná do 21.10.2012

HDčko má root a aktuálně Cyanogenmod ROM, ale můžu přehodit i na ofic. ROMku.

Příslušenství:
originální krabička + nabíječka
1x baterie navíc 1600mAh
2x kolébka + kabel
1x 16gb microSD karta
1x polokožené pouzdro (nepoužívané)
1x držák do auta

Cena: 5500Kč

Pokud by jste měli zájem nebo o někom věděli, tak přepošlete / ozvěte se.

Mám druhé Vánoce - Adobe Fireworks CS5

Skoro po třech letech jsem si objednal a koupil na tvorbu grafiku další software, tentokrát Adobe Fireworks CS5.

01

V prosinci jsem si vyzkoušel trial verzi a bylo rozhodnuto. Tenhle žlutej ohňostroj mě přesvědčil, že je to skvělý nástroj na prototypování aplikací a vývoj grafiky nejen pro mobilní zařízení. Navíc třeba od Adobe Photoshop je o 2/3 levnější (cca 7300kč s DPH).

02

Fireworks jsem kupoval zde: http://www.svetsoftware.cz/adobe-fireworks-cs5. Obchod dodal do třetího dne. Takže maximální spokojenost.

Haleluja, jdu provětrat CD mechaniku :-)