Zpět na blog
Vzdělávání

Izometrický design: 3D objekty zobrazené ve 2D prostoru

Ľudovít Nastišin
10.06.2021
4 minuty čtení
Izometrický design: 3D objekty zobrazené ve 2D prostoru
Ve své podstatě představuje izometrický design způsob, jakým zobrazujeme trojrozměrné objekty ve dvourozměrném prostoru. Izometrie však není totéž jako perspektiva, která je obvykle úzce spojena s realistickým uměním. Hlavním důvodem je to, že nemá žádný „mizející bod“ (vanishing point). Právě to umožňuje izometrickým tvarům zachovat si kompozici bez ohledu na to, kde člověk stojí nebo sedí při pozorování izometrického designu.

Možná sis všiml izometrické reklamy, v digitálu nebo infografikách, či ve svých oblíbených videohrách a ilustracích. Izometrické umění dává designérům nečekaně široké spektrum možností. A protože je založeno na tvarech, izometrické kresby se vytvářejí překvapivě jednoduchým procesem. Je to také velká legrace! Většinou...

Jak vytvářet izometrické designy

Design je izometrický pouze tehdy, kopíruje-li izometrickou mřížku. Tu tvoří vertikální čáry, které zůstávají při postupu svislé a všechny vodorovné čáry jsou skloněny o 30 stupňů. Toto se také nazývá pravidlem 120 stupňů. To říká, že úhel mezi osami X, Y a Z musí být celkem 120 stupňů.
  • Design se musí řídit izometrickou mřížkou
  • Design nemůže obsahovat sbíhající se čáry
  • Svislé čáry zůstávají svislé, zatímco vodorovné čáry mají 30 stupňový sklon
  • Osa X, Y a Z dohromady tvoří celkem až 120 stupňů

Kdy použít izometrický design

Izometrická projekce je pro designéry velmi užitečná – zejména architekty, průmyslové a interiérové ​​designéry, protože je ideální pro vizualizaci místností, produktů či infrastruktury. Je skvělým způsobem, jak rychle otestovat různé designérské nápady.

Existuje spousta dalších situací, ve kterých je izometrická projekce užitečná. V systémech orientace například v muzeích nebo galeriích mohou izometrické nástěnné mapy ukázat návštěvníkům, kde se v budově nacházejí, co se děje jinde a jak se tam dostat.

Některé z nejlepších infografik používají izometrickou projekci, která jim umožňuje zobrazit více informací, než by bylo možné na 2D výkresu. A dokonce i loga používají tento přístup k vytvoření efektu prostorového efektu.

Isometric case study: Monument Valley 

Jelikož pohled v této hře má jediný bod, který se nikdy nepohybuje, objevily se zde zajímavé problémy týkající se manipulace perspektivy. I když se zdá, že stezka nebo most vede na první pohled do slepé uličky, rychlé otáčení mapy ukazuje cestu vedoucí na nové místo. Díky tomu je ve hře spousta hlavolamů, které se zdají buď nemožné nebo příliš jednoznačné. Ale ani jedno není pravda. Je to jen komplikovanější, než se na první pohled zdá.

A aby tohoto efektu mohli dosáhnout, vše se muselo přesně seřadit v různých úhlech. Proto se vývojáři rozhodli položit hru do 30stupňové izometrické mřížky. To znamená, že každý úhel, který vidíte, je buď 30 stupňů, 120 stupňů nebo zcela svislý, což jsme si již vysvětlili výše.
Izometrický design je skvělá technika pro oživení 2D flat designu. Přirozenou výhodou je, že grafiku pomocí izometrické projekce vnímáme jasněji a velmi dobře se v ní umíme orientovat.

Izometrické vzory vytvářejí realitu, ve které můžeme vnímat věci takové, jaké jsou. Divné, ale funkční. A právě to z ní činí vynikající doplněk k alternativám designu, které už máš ve svém portfoliu.
Ľudovít Nastišin
Som digitálny kreatívec (problem solver), ktorého špecializácia je "kreatívny kitbash". Táto profesia neexistovala, dokým som si ju nevymyslel, pretože práve to ma vystihuje najviac. Ide o schopnsoť  kombinovať digitálne skilly (3D, 2D, animácia, VFX, generative AI, ilustrácie,...) s cieľom vytvoriť čo je treba a to bez ohľadu na zadanie. 

Klienti, s ktorými som pracoval:
  • Deutsche Telekom IT Solutions Slovakia,
  • Východoslovenská distribučná, a.s.,
  • Nefkus Creative House,
  • EMEFKA & Startitup Group,
  • Promiseo,
  • Letisko Košice,
  • Boataround,
  • DMS Records 
  • ...a ďalší


Mohlo by tě zajímat

Podmíněné formátování v Excelu
Vzdělávání
14.05.2021
Skillmea

Podmíněné formátování v Excelu

V tomto článku ti popíšeme, jak využívat podmíněné formátování v Excelu. Podmíněné formátování je dobré využívat tehdy, když potřebuješ změnit formát vybraných buněk, pokud jsou splněna jistá kritéria (podmínky). Formátovat lze více atributů, může to být barva, procenta, data a podobně. Co je to podmíněné formátování?Podmíněné formátování (nebo conditional formatting) je Excel nástroj, pomocí kterého můžeš nastavit automatické formátování buněk. Podmíněné formátování slouží k vyznačení údajů, které splňují nějakou tebou zadanou podmínku. Uvedu jeden příklad: máš databázi produktů (může jich být 100, 1000 nebo 10000) a chceš v této databázi vyznačit zelenou barvou pouze produkty, jejichž cena je nižší než 50 Eur. Nyní přichází na pomoc podmíněné formátování. Když si to rozbijeme na drobné, nejspíš: 1. Formát: vyznač zelenou barvou. 2. Podmínka: cena nižší než 50. Příklad podmíněného formátování přes "ROVNÁ SE"Mám Excel tabulku s údaji o zaměstnancích a oddělení, ve kterém pracují. Tabulku si můžeš stáhnout odsud, případně si použij jakýkoli vlastní Excel soubor. V mém souboru chci formátem barevně odlišit všechny zaměstnance, kteří pracují v oddělení HR.[Image] Jak budu postupovat?Nejprve si označím všechny buňky, které plánuji formátovat. Mohu to udělat potažením myší, nebo v případě většího počtu údajů použij klávesovou zkratku CTRL+SHIFT+⬇ (pro MacOS uživatele je to CMD+SHIFT+⬇). Následně na záložce DOMŮ (HOME) tvého Excelu vyhledej Podmíněné formátování (Conditional Formatting) a následně Pravidla zvýrazňování buněk (Highlight Cells Rules) a poté nástroj Rovná se (Equal to), viz obrázek níže.[Image] Nyní vepíšeš hodnotu HR do políčka, které jsem vyznačil barevně na obrázku níže a použiješ buď některý z přednastavených formátů, nebo si vytvoříš vlastní. Po odkliknutí se ti barevně odliší všechna pole obsahující HR. “Je dobré zmínit, že Excel nerozlišuje velká a malá písmena, takže kdyby do daného filtru vepíšeš i „hR“, „hr“ nebo „Hr“, tak Excel bude vědět, co od něj chceš. Pokud bys však už použil diakritiku, s tím si Excel neporadí.[Image]” Výsledek našeho podmíněného formátování bude tedy vypadat následovně:[Image] Zrušení podmíněného formátováníPro zrušení podmíněného formátování můžeš použít dva způsoby. Prvním z nich je vymazání podmíněného formátování jen pro tebou označené buňky nebo smažeš podmíněné formátování z celého Excel archu. Oba způsoby uděláš opět přes záložku Podmíněné formátování a Vymazat pravidla. Následně už jen zvolíš, jestli chceš smazat pravidlo z označených buněk nebo z celého archu.[Image] Podmíněné formátování můžeš využít i při práci s kontingenčními tabulkami, s grafy a pod. Práce s Excelem je díky podmíněnému formátování rychlejší a kvalitnější. Možností pro práci a filtrování díky podmíněnému formátování je mnoho, stačí si s touto možností jen pohrát. Vyzkoušej to sám i pro další možnosti podmíněného formátování - Větší a menší než; Mezi; Text obsahující; Vyskytující se datum a pod.
Agilní vývoj - úvod do problematiky
Vzdělávání
10.05.2021
Skillmea

Agilní vývoj - úvod do problematiky

Co je agilní vývoj? „Agilní metodiky pro řízení vývoje software jsou takové metodiky, které využívají agilního přístupu, tedy pružně reagují na změnu, průběžně rozvrhují práci v průběhu vývoje a ověřují výstupy s uživateli. Agilní metodiky obsahují základní principy, kterými by se měl úspěšný projekt vývoje software řídit. Proces vývoje je díky agilnímu přístupu postaven na týmové spolupráci, otevřené komunikaci týmu, zapojení zákazníka a celkové flexibilitě a otevřenosti změnám. Využití agilních metodik pro vývoj softwaru v praxi: Agilní přístup k vývoji se uplatňuje především u složitého, komplexního nebo inovačního softwaru, u kterého je velmi obtížné sepsat detailní požadavky na začátku projektu. Ty se postupně upřesňují nebo tvoří průběžně na základě zkušeností s prototypy z jednotlivých iterací vývoje na základě zpětné vazby od uživatelů. Agilní metodiky jsou zaměřeny na efektivnost práce, kvality výsledků a spokojenost uživatelů. Nesnaží se potlačovat změny oproti původnímu plánu, ale naopak je pro ně charakteristické upřesňování a přizpůsobování výsledného softwaru.“ (zdroj: managementmania.com) Následně když víme, že budeme používat agilní vývoj, potřebujeme nějaký tool – nástroj, kde budeme řídit úkoly. Jedním z nejznámějších nástrojů je Jira. Agilní přístupy a metodikyAgilních přístupů a metodik je mnoho. Záleží, co v projektu potřebujete. Nejznámější metodika je Srum. V Jiře si umíme zvolit zejména mezi Scrum a Kanban. Co vybrat? Záleží na projektu. Ve firmě budeš pravděpodobně používat Srum. Jaký je rozdíl? Kanban je o hlavně o vizualizaci práce. Kanban používá kolonky, které představují různá stádia vývoje. Vezmu si roli – je přidělena. Daný člověk na ní začne dělat - je v kolonce in progress (pracuje se na ní). Poté je úloha posunuta na test nebo dokončena. Kolonky si můžete přizpůsobit. Zde si o tom můžeš přečíst obšírněji. Scrum týmy pracují ve stanovených intervalech zvaných sprinty. Sprint je přibližně týden nebo dva. Během sprintu pracují lidé na úkolech, které jim byly přiděleny na začátku sprintu na takzvaném plánování sprintu. Srum vede jedna osoba a tou je takzvaný Srum master. Během Srum vedení týmu se cíle projektu upravují – sbírají se informace od klientů, od uživatelů a poté se aplikují změny. Tady si o tom můžeš přečíst obšírně. JiraJira je zdarma pro jednoduchý projekt a tím. Na této stránce si umíš založit svou Jiru. Jira je tool pro management úkolů a tyto úkoly musí být přiřazeny do projektů. Tedy jako první krok je vytvoření projektu. Jsi přihlášen v Jiře a v pravém horním rohu budeš mít tlačítko na vytvoření projektu.[Image] Vytvoríš si projekt:[Image] Jako Template je vybrán Kanban. Toto umíme změnit po stisku Change template. Co zvolíš je na tobě. Pojdu si ukázat Scrum. Vyberu Scrum a vytvořím projekt. Momentálně nemáme žádný sprint. Musíme jej vytvořit, abychom začali vývoj. Jdeme do Backlogu, což je místo, kde máme vytvořené úkoly.[Image] Bez úkolů nebude sprint. Vytvoř si úkoly. Máš na výběr několik míst, kde vytvořit úkoly, ale princip je stále tentýž – mít úkoly, na kterých se může pracovat.[Image] Když máme vytvořené úkoly, tak umíme spustit sprint.[Image][Image]  Vytvořil si sprint. Nyní je prázdný. S týmem se domluvíte, co se má udělat a dané úkoly se přetáhnou z backlogu do sprintu. Dohodli jsme se, že uděláme dva úkoly a jeden ponecháme v backlogu. Následně spustíme sprint.[Image] Při spuštění určíme, jak dlouho má sprint probíhat. Nyní je sprint aktivní a umíme si prohlédnout nástěnku sprintu. V této nástěnce vidíme, v jakém jsou úkoly stádiu.[Image] Samozřejmě nesmíš zapomenout daný úkol někomu přidělit. Otevřeš si úlohu a assigneš (přidělíš) ji někomu.[Image] Daný uživatel si umí vypsat jen jeho úkoly v daném sprintu.[Image] Autorem článku je Jaroslav Beňo.
O zlatém řezu a jeho aplikacích v designu
Vzdělávání
11.04.2021
Ľudovít Nastišin

O zlatém řezu a jeho aplikacích v designu

V designu jako takovém je velmi důležité, aby byl výsledek práce jasný a každý mu chápal. Ať už je to ve formě zalomení textu, oříznutí fotografie nebo navržení loga. Za tímto účelem se kromě jiných pomůcek často využívá i aplikace zlatého řezu, o kterém si nyní něco povíme. Z angl. „Golden ratio“ hovoříme o konkrétním matematickém poměru, který se velmi často vyskytuje iv přírodě a designové odvětví se jím inspiruje. Zlatý řez nám pomáhá dosáhnout co nejpřirozeněji působících proporcí, tvarů či struktury. “Zlatý řez vznikl již ve starověkém Řecku” Jedná se o velmi speciální číslo - 1,618. Vychází ze známé Fibonacciho posloupnosti a jeho aplikaci můžeme nalézt iv přírodě, například ve tvaru mořské mušle či ve formaci oblaků u hurikánů. Tato posloupnost je tvořena vždy částkou dvou předchozích čísel (0-1-1-2-3-5-8-13-21-...). A právě z této sekvence odvodili už ve starověkém Řecku zlatý řez (golden ratio), aby uměli lépe vyjádřit rozdíly mezi čísly sekvence. Jak používat zlatý řez v designuAplikace zlatého řezu do designérské profese vůbec není tak náročná, jak by se mohlo na první pohled zdát. Jeho využitím můžeme vytvářet například proporcionální layouty na web. Pokud chceme navrhnout web, který má vedle prostoru pro hlavní obsah i sidebar, tak právě s využitím zlatého řezu umíme stanovit jejich přesnou šířku. Pokud by se jednalo řekněme o prostor o šířce 960px, tak prostor pro hlavní obsah by měl mít šířku 593px (960px/1,618) a sidebar šířku 367px (593px/1,618). Samozřejmě, že v praxi do toho vstupuje několik dalších faktorů (např. padding), ale logiku tohoto poměru to deklaruje skvěle.[Image] A jelikož toto číslo vychází ze sekvence nekonečného množství čísel, tak jeho opakovaným aplikováním získáme různé velikosti (délky, šířky,...), se kterými můžeme v designu pracovat a vyskládat z nich funkční a intuitivní UI. Jak jsme si již říkali, zlatý řez lze aplikovat v podstatě na všechny oblasti designu či kreativy. Ukážeme si k tomu několik příkladů. Ořezávání obrázkůPokud se jedná pouze o ořez prázdného prostoru na kraji fotografie, věc je jednoznačná. Ale pokud je třeba oříznout i samotný obsah fotografie či obrázku, situace se mění. Výsledek musí zůstat vyvážený a ty nejdůležitější věci na obrázku by měly mít své místo. Právě s tím nám umí pomoci zlatý řez.[Image] (Zdroj: industrydev.com) Typografie a hierarchie Umíme si také pomoci při výběru správné kombinace velikosti použitých fontů. Takto bude mít název, podnázev a samotný text tu správnou velikost a hierarchie mezi nimi bude okamžitě jasná.[(Zdroj: Invisionapp)] UI Webdizajn Rozložení jednotlivých elementů a ploch na webu rozhoduje o tom, jak intuitivně se bude návštěvník webu cítit. A stejně tak, jestli se mu to bude líbit. Jak jsme již dříve psali v článku, například šířka jednotlivých sloupců je díky zlatému řezu jasně stanovena.[(Zdroj: Apiumhub)] LogoA posledním příkladem je využívání zlatého řezu při tvorbě loga. Tady to možná na první pohled není až tak očividné. No věřte, že zlatý řez se zde aplikuje velmi často ai ta nejznámější loga byla vytvořena právě s jeho pomocí.[(Zdroj: Twitter, NatGeo)]Někdy jej v logu najdete jednoduše (National Geographic logo), jindy je to trošku skryté (Twitter logo). Právě v tom druhém případě bylo logo vytvářeno za pomoci série kružnic s jasně danými velikostmi. Ty pomáhaly vytvářet všechny křivky a záhyby loga, dokud z něho nevzniklo ikonické logo, které působí přirozeně a hezky. A není to náhoda. Zlatý řez je není technika, je to spíše myšlenkový proces. Vědět ho aplikovat efektivně chce svůj čas. Určitě se však vyplatí pohrát si s ním a zkoušet podle něj vytvářet nějaké layouty či ořezávat důležité fotografie. Šikovnou pomůcku v podobě spirály zlatého řezu najdeš zde.

Nezmeškej info o nových kurzech a speciálních nabídkách