Programátorské kroužky Skillmea Kids

Při tvorbě kurzu iOS Developer jsme rozhodovali, který z jazyků si vybrat jako výukový. Z mého pohledu bylo toto rozhodnutí relativně jednoduché, ale pro úplnost si shrňme důvody, proč to nakonec vyhrál jazyk  Swift .[Image] Apple nám na letošní WWDC představil svůj nový programovací jazyk Swift. Ten by měl být rychlejší bezpečnější modernější a mnoho dalšího. Já osobně za jeho hlavní výhody pro začátečníky považuji jednodušší syntaxi, Playground a interaktivní debugovací konzoli. Jednodušší syntaxSkoro vždy, když jsem si povídal s nějakým vývojářem, který Objective-C viděl, nebo se s ním pokoušel pracovat, přišla řeč i na syntaxi tohoto jazyka. Nepadlo na její adresu snad jediné pozitivní slovo. Kopec hranatých závorek, názvy metod s mezerami, hvězdičky a množství zbytečného kódu kolem. Také mi dost dlouho trvalo, než jsem se s tímto stylem zápisu sžil, i když nakonec jsem mu přišel na chuť. Swift je svojí syntaxí velmi podobný rozšířeným jazykům jako například. JavaScript, C, Ruby, atd., takže pro lidi, kteří už v něčem programovali (a nebylo to nic exotického :-)) bude seznámení se Swiftem jednoduché. Ti, kteří nikdy neprogramovali to budou mít také mnohem jednodušší ve srovnání s Objective-C. Swift od nás, mimo jiné, nepožaduje rozdělovat zápis tříd do dvou samostatných souborů, importovat soubory s deklaracemi nebo si lámat hlavu se správou paměti. PlaygroundXCode ve verzi 6 disponuje novým nástrojem s názvem Playground. Jeho účel vyplývá z jeho názvu. Slouží k „hraní si“ s kódem. Obrazovka je rozdělena na dvě části. Vlevo uživatel píše svůj kód a vpravo hned vidí výsledek. Začínající programátor tedy nebude muset řešit, jaký typ aplikace vytvořit, co všechno kde zaškrtnout a zvolit. Stejně tak nebude muset po každé změně znovu spouštět aplikaci. Je to ideální způsob, jak se s jazykem seznámit a poznávat jej do detailů. Playground není omezen pouze na textový výstup, ale poskytuje také grafické prostředí. Stejně tak zobrazuje programátorovi i případné chyby a upozornění, že něco by mohl udělat jinak resp. lepší.[Image] Interaktivní debugovací konzolaBěžně se při vývoji aplikace stává, že napíšu kus kódu, aplikaci spustím, abych viděl, co jsem vlastně vytvořil a následně zjistím, že se nechová přesně tak, jak bych si představoval. Nebo si jen chci ověřit, co by se stalo když... Doposud jsem to mohl řešit tak, že po každé drobné změně jsem aplikaci znovu spustil a ověřil si, zda se daná změna projevila tak, jak jsem očekával. Tato metoda je náročná v případě, že funkcionalita, kterou potřebuji prověřit je „vzdálená“ několika tapnutí na obrazovku, nebo je závislá na specifickém stavu aplikace resp. prostředí se kterým aplikace pracuje, jako např. vzdálený server. Se Swiftem přichází také  Read-Eval-Print-Loop (REPL) . Je to debugovací konzole, která poskytuje interaktivní verzi Swiftu, pomocí které lze komunikovat s běžící aplikací, nebo si jen ověřit své nápady ve skriptovacím prostředí XCode nebo systémové konzole. Již zanedlouhoProti použití Swiftu v našem kurzu momentálně říká v podstatě jen to, že ještě není ve své finální podobě a vývojáři v Apple jej mohou ještě decentně upravit. Osobně si myslím, že pokud se tak stane, bude to v minimálním rozsahu a náš kurz to neovlivní. Autorem tohoto blog postu je lektor kurzu iOS Developer Števo Ľupták. Máte-li nějaké dotazy týkající se Swiftu nebo kurzu, napište je do komentářů.

Pokud jste webdesignér a chcete držet krok s tak dynamicky se vyvíjejícím odvětvím jakým je webdesign, vzdělávání a samostudium je nezbytné. V tomto blogpostu jsme zveřejnili několik ebooků, které jsou zdarma dostupné na webu a určitě se hodí pro mnohé začínající, ale i zkušené webdesignéry. 1. Pixel Perfect Precision Handbook  První vydání tohoto handbooku od digitální agentury ustwo mělo něco přes 100 stran a šlo spíše o souhrn doporučení pro práci s pixely a Photoshopem. Současný handbook vol. 3 má přes 200 stran az PPP se stal osvědčený návod pro designéry. [Image] 2. Type Classification eBook  Tento ebook představuje 10 základních klasifikací písma se stručnou historií a klíčovými charakteristikami. Pro designéry je perfektní pomůckou při výběru psíma do svých designů. [Image] 3. Typo Tips  Tento ebook je vhodný pro každého, kdo se chce zlepšit v typografii a nabízí 7 tipů pro lepší typografii ve vašem designu. [Image] 4. Designing for the Web  Jedná se o opravdu výbornou knihu od Five Simple Steps , která pokrývá velké množství oblastí, technik a přístupů k web designu. Je rozdělena do pěti částí včetně typografie, barev a layoutů. [Image] 5. Learning Web Design Kniha vhodná pro úplné začátečníky, kteří nemají zkušenosti s tvorbou webů. Naleznete v ní kapitoly o tom, jak web vůbec funguje, později se přes HTML a CSS dostanete až k JavaScriptu. [Image] 6. Introduction to Good Usability Dobrá použitelnost webu je něco, co u mnoha designů webů chybí. Tento ebook je vhodný hlavně pro designéry, kteří mnoho webů zatím nenadesignovali a mohou se inspirovat při rozvržení jednotlivých prvků na webu z již existujících a osvědčených řešení. [Image] 7. The Design Funnel: A Manifesto for Meaningful Design Tato kniha od Stephena Haya vám napomůže k tomu být kreativní s vašimi pracemi a designy. The Design Funnel představuje plán použití různých nástrojů designérům, aby tak nastartoval svoji kreativitu. [Image] 8. Bulletproof Web Design Autor Dan Cederholm v této knize popisuje strategie pro vytvoření designu, který je flexibilní. Každá kapitola obsahuje několik rad, jak připravit přitažlivý design, který je zároveň připraven pro různé množství textu, obsahu a pod. [Image] Samozřejmě existuje ještě mnohem více knih a ebooků, které jsou dobrým zdrojem rad, nápadů a inspirací. Máte-li svoji oblíbenou knihu, kterou chcete doporučit i dalším, podělte se s jejím názvem v komentářích.

Kvalitní a přitažlivý grafický design je nezbytnou součástí každého dobrého webu. Za designem se skrývá mnoho teorie, na kterou se ve zkratce podíváme v tomto blogu postu. Mnozí z nás umí používat Photoshop a vytvořit v něm design, který vypadá atraktivní a poměrně dobře. Za designem, který vytváříme, je obrovské množství teorie. Znalost této teorie je chybějící částí pro mnohé (talentované) designéry. V dalším textu ve zkratce probereme 5 základních oblastí, které by měl dobrý webdesignér ovládat.  TypografieTypografie tvoří 80-90% z web stránky. Při množství informací a textů, které denně procházíme, je nutné udržet co nejjednodušší a nejrychlejší způsob, jak se dostat k informacím, které potřebujeme. [Image] Dobrá a přehledná prezentace obsahu na webu je stejně důležitá jako pěkná grafika a vymakaný copywriting. Typografie (na webu) není jen o výběru některého z fontů. Typografie na webu se skládá ze 4 základních elementů:  1. kontrast: texty na webu jsou k tomu, aby se četly. K tomu, aby se četli dobře, je vhodné použít správný kontrast barvy písma a pozadí. Pokud si nejste jisti, zda je kontrast dostatečný, udělejte si screenshot ze stránky, vložte jej do např. Photoshopu a změňte jej do grayscale. 2. velikost písma: příliš malé písmo je obtížněji čitelné a proto, pokud je to možné, nenastavte velikost písma v pod 10 nebo 12px.  3. hierarchie: měnit velikost písma je jednou z nejlepších možností, jak rozlišovat obsah. Další z možností je mixování různých stylů, například používat kapitálky nebo italic pro podnadpisy, nebo smíchat serif a sans serif.  4. místo (space): nebojte se nechat na vašem webu prázdná místa , tento negativní nebo bílý prostor napomůže k tomu, aby byla pozornost zaměřena na text - obsah. Dobří návrháři ve snaze o dosažení rovnováhy mezi barvou písma a bílými (nebo negativními) místy tráví nad svými návrhy poměrně mnoho času. Teorie barev Použité barvy a barevnost webu patří k jeho nejdůležitějším aspektům, neboť pomocí barev lze vyvolat v lidech emoce. Barvy dělíme na teplé a studené. Mezi teplé barvy řadíme např. červenou, oranžovou a žlutou. Modrá, fialová a zelená jsou studené barvy. Jako základ pro pochopení barev a vztahů mezi nimi slouží tvz. barevný kruh , který představuje rozdělení barev do tří skupin (primární, sekundární a terciární). [Image] Primární barvy jsou červená, zelená a modrá (RGB) a jejich kombinací dokážeme vytvořit všechny ostatní barvy. Sekundární barvy vznikají kombinací dvou primárních barev a terciární barvy vzniknou tehdy, když zkombinujeme jednu primární a jednu sekundární barvu. Barvy můžeme rozdělit na analogické a komplementární, čímž vyjadřujeme vztah mezi nimi.  Analogické barvy jsou umístěny vedle sebe a můžeme je tedy dobře kombinovat. Komplementární barvy jsou naopak na barevném kruhu umístěny naproti sobě a díky tomu dokážeme dosáhnout dostatečného kontrastu na našem webu. Kromě toho známe monochromatické či triadické barevné schémata. Nejdůležitější věc, kterou byste měli mít na paměti, je že barvy ve vašich grafických návrzích by měly zlepšit zážitek ze čtení a ne odvádět od něj pozornost. Při výběru těch správných barev vám pomohou online nástroje, například. Adobe Color CC / Adobe Kuler (color.adobe.com). Design založený na gridech Když toho už víte hodně o typografii a barvách, je čas podívat se na grid systém ve vašem designu. Gridy umožňují designérovi vytvořit design, který je přehledný a čitelný. Grid systémy jsou skvělou pomůckou při umísťování jednotlivých prvků do designu. Jedním z příkladů grid systémů je 960gs, jehož základ tvoří sloupce o celkové šířce 960 pixelů, které jsou rozděleny na 12 a 16 sloupců. Systémy se tedy liší v šířce sloupců, 12 sloupcový má sloupce o šířce 60px a 16 sloupcový o šířce 40px. Každý sloupec navíc obsahuje 10pixelový margin vlevo a vpravo. 960 grid systém je vhodný pro rychlé prototypování, ale funguje dobře i v produkčním prostředí. Použitím tohoto systému lze rozdělit si jednotlivé části webu tak, aby vždy působily vyváženým dojmem. [Image] Grid systémů je samozřejmě více, každý si může zvolit takový, který mu více vyhovuje. Rozhodně je ale velkou výhodou grid používat. Teorie designu Design vaší webstránky je důležitý iz marketingového hlediska, bude na něm záviset prodej vašeho produktu. Proto je dobré držet se některých základních pravidel. Prvním z nich je vizuální hierarchie. Tímto pojmem se myslí uspořádání webu, v jakém jej vidí uživatel. Jelikož některé části vaší stránky jsou důležitější než ostatní (jde zejména o formuláře, call-to-action prvky, value propositions apod.) chcete, aby na ně návštěvníci klikali. Zlatý řez (řecké písmeno phi) je nejstarším a nejpoužívanějším kompozičním principem, který má své využití i ve web designu. [Image] Nebojte se bílého místa na webu. Bílý prostor (negativní prostor) je část stránky, která není použita. Neměla by však být považována za nevyužitou, je jedním z důležitých elementů ve web designu. Správně využitý bílý prostor podporuje vizuální hierarchii a zlepšuje přehlednost webu. UI & použitelnost Dobrá uživatelnost webu závisí na mnoha faktorech. Responzivní design a tedy dobré ovládání i na mobilech či tabletech je v současnosti trendovou a velmi potřebnou záležitostí. [Image] Kvalitní hosting a tedy rychlé načítání stránek a platné linky také napomáhají k dobré použitelnosti. Základním principem je přehlednost - uživatele je snadné "ztratit" rušivými prvky a pokud na vaší stránce nenajde co hledá, odejde. Úkolem dobře nadesignovaného webu je poskytnout uživateli jednoduchý, přehledný a user-friendly zážitek . s uvedením adresy a telefonního čísla.K dobré použitelnosti webu v neposlední řadě patří relevance.Musíte poskytovat obsah, který vaši návštěvníci hledají a váš design by jim měl pomoci najít to, co hledají.Dobrá použitelnost se dolaďuje delší dobu, vyžaduje uživatelský průzkum a neustálé testování.  Dobrý webdesignér by měl ovládat i tuto teorii a tudíž by měl umět nejen „jak“ to udělat, ale i „proč“ to tak udělat. Potom následuje tvrdá práce na sobě, neustálé vzdělávání se, sledování trendů a zkoušení. Pokud byste se chtěli dozvědět více, máte možnost zúčastnit se kurzu Visual Design , na kterém se během 6 týdnů naučíte základní designérské principy a techniky a vytvoříte logo, základní design manuál a design webu.