Prejsť na navigáciu

Blog o webdizajne

Vyrobte si štýlovú infografiku vo Photoshope

Naučte sa vytvoriť jednoduchú a efektívnu infografiku vo photoshope a držte sa pritom aktuálnych trendov pri tvorbe štýlovej a modernej vektorovej grafiky.

Dodajte obrázkom efekt starej fotografie

Čo je na starých fotkách zaujímavé? Prečo sa v niektorých dizajnoch tieto fotky stále používajú? A prečo sa dokonca aj umelo vytvárajú? Odpoveď je ľahká. Sú jednoducho pekné a nikdy nestarnúce. V nasledujúcom návode ponúkam jednu z možností, ako tento pekný efekt dosiahnuť. Návod je určený pre stredne a viac pokročilých používateľov.

Vytvorte si abstraktné pozadie vo photoshope

Radi by ste si nastavili príjemnú tapetu na vašom počítači? V nasledujúcom návode si ukážeme, ako si jednu môžete vytvoriť úplne sami. Stačí vám na to Photoshop, pár jednoduchých krokov a nové pozadie je na svete.

Prilepte si pätu na spodok stránky

V tomto návode vysvetlíme, ako pripevniť pätu na spodok stránky pri krátkych textoch. Pomocou tohto triku zabezpečíme, aby bola pri krátkych textoch päta vždy na spodku okna prehliadača a pri dlhých textoch automaticky posunutá až za obsah stránky. Tento spôsob je vhodný najmä pre stránky s obmedzeným množstvom obsahu na niektorých podstránkach. Veľkou výhodou tohto kódu je fakt, že funguje identicky vo všetkých hlavných prehliadačoch.

Predvyplnené formulárové polia - ako naplniť alebo vyčistiť textbox pomocou jQuery

V tomto jednoduchom tipe ukážeme ako pomocou jQuery „vyčistiť“ formulárové pole po kliknutí, prípadne ho znova naplniť textom, ak do neho používateľ nič nenapíše.

Táto funkcia je výhodná pre obe strany – tvorcu stránky, ktorý potrebuje zbierať presné dáta, aj návštevníka, ktorého práca s poľami sa zjednoduší…

Hromadná zmena veľkostí efektov vrstvy vo Photoshope

V Illustratore je známa možnosť zväčšovať a zmenšovať efekty cesty zväčšovať a zmenšovať pri zväčšovaní a zmenšovaní cesty alebo objektu. Takáto možnosť často chýba užívateľom vo Photoshope – keď má vrstva nastavený efekt tieňa na 20 px, pri zväčšovaní alebo zmenšovaní vrstvy zostáva tieň stále 20 px.

Čo však robiť, keď  má vrstva nastavených napríklad 5 rôznych efektov a potrebujeme zväčšiť alebo zmenšiť viac vrstiev? Postupné upravovanie všetkých jednotlivých efektovje v takomto prípade veľmi zdĺhavé.

Pomôže nám možnosť úpravy veľkosti efektov hromadne, pomocou nástroja Scale Effects.

Rozmazané farebné pozadie na webstránku alebo obrazovku

Takzvané „rozmazané“  alebo „rozostrené“ pozadia webstránok sa stali nedávno veľmi populárnymi, najmä vďaka rozšírenému tzv. Vista efektu. Je zrejmé prečo – sú prosto pekné a stránkam dodávajú nádych tajomna a profesionálny šmrnc.

Stále rýchlejšie pripojenia umožňujú dizajnérom využívať bez ostychu aj veľkorozmerné pozadia a teda možností hrať sa s efektmi je skutočne neúrekom.

V tomto tutoriáli vytvoríme na pozadí webstránky intenzívnu žiaru vychádzajúcu spoza tela stránky. 

Vektorové puzzle dieliky v Adobe Illustratore

Pred pár dňami som v jednom fóre narazila na žiadosť o návod, ako vytvoriť vzor opakujúcich sa puzzle dielikov.

Keďže z vesmírneho hľadiska pokladám za dobré vytvárať trvalé hodnoty s potenciálom na opakované využitie (;]), rozhodla som sa poskytnúť návod na vytvorenie opakujúceho sa vzoru puzzle dielikov vo vektoroch – teda dieliky, ktoré sa dajú ľubovoľne zväčšovať bez straty kvality, majú presne taký tvar, aký od nich očakávam a môžem ich aplikovať kdekoľvek potrebujem a akýmkoľvek spôsobom.

Ako na editovateľné polia pomocou jEditable plugin v ASP.NET s WebServices

V tomto návode vám ukážem ako prinútiť spolupracovať jEditable jQuery plugin a ASP.NET WebService dekorovanú ScriptServiceAttribute ASP.NET AJAX atribútom na vytváranie praktických editovateľných polí.

Pozrite si demo in-place editovateľných polí – zdanlivo obyčajný text web stránky je priamo editovateľný pomocou zmeny na formulár a naspäť na text...

Viacnásobný stroke v Adobe Illustratore

V Adobe Illustratore sú každému dobre známe funkciie Fill (Vyplniť farbou alebo gradientom) a Stroke (Obtiahnuť farbou).

Objekt môže mať nastavené rôzne kombinácie fill a stroke, alebo žiadne. Skvelou vlastnosťou Illustratora CS4 je, že umožňuje jednému objektu nastaviť viacnásobný stroke a viacnásobný fill. Nastavené vlastnosti sa správajú ako vrstvy, viacero obtiahnutí sa teda navrství na seba, podobne, ako jednotlivé cesty a objekty.

S jednou cestou sa teda dá dosiahnuť neobmedzené množstvo efektov, a to len aplikáciou viacerých obtiahnutí...

Ako usporiadať vrstvy a skupiny vo Photoshope pri výrobe webstránky

Pri grafických návrhoch nádejných photoshopových začiatočníkov sa často môžeme stretnúť s fenoménom tzv. strašného chaosu a dezorganizácie pri práci. ;]

Nadšený grafik začne realizovať svoju predstavu, kreslí všetko do jednej vrstvy, alebo naopak vytvára vrstvy jednu za druhou. Kopíruje a premiestňuje objekty, vytvára dizajn podstránok v samostatných súboroch, zarovnáva objekty od oka a vraví si, že detaily sa v CSSkách nakoniec sami vyriešia.

Dizajn nakoniec môže skončiť výborne, ale pre svojho tvorcu zbytočne namáhavý. Po viacerých ukončených projektoch si zvyčajne každý vyvinie určitý spôsob práce a drží sa ho, čím sa mu celý proces výroby stránky zjednoduší a zefektívni.

Pozrime sa na jeden z možných spôsobov organizácie psd súboru a to konkrétne môj vlastný. ;]

Webová typografia – veľkosť fontu a riadkovanie

Kvalitná prezentácia textu na webstránke je rovnako dôležitá ako krása grafiky a zmysel textu.

Na dobré usporiadanie textu na webe mnoho slovenských dizajnérov zabúda. Grafik, ktorý vymyslí vizuál stránky, má často o riadkovaní, odstavcoch a zarovnaniach len letmú predstavu a kóder je rád, že sa mu grafikovu predstavu podarí nasekať do CSS.

Pravidlá typografie na webstránke sa odlišujú od typografie v iných médiách. Pozrime sa na niekoľko základných pravidiel formátovania textu v CSS, konkrétne určovanie veľkosti písma, riadkovania a vertikálneho odsadenia.

Ako naštýlovať pekný objekt, ktorý sa vertikálne prispôsobí obsahu

Na webstránkach sa zvyčajne vyskytuje množstvo objektov, ktorých obsah je vizuálne odlíšený od okolitých objektov.

Dizajnér pri tvorení grafiky občas narazí na situáciu, keď potrebuje nakresliť pekný objekt, ale nevie presne, akú bude mať na stránke funkciu. Nevie teda, aký bude mať objekt obsah, a teda ani aký dlhý môže byť.

V takom prípade existuje niekoľko spôsobov, ako takýto objekt naštýlovať. Každý spôsob má svoje výhody a nevýhody. Vytvorenie takéhoto objektu sa môže niekomu zdať triviálne, pozrime sa ale pre istotu ako na to. ;]

Poraďte sa s nami o službách, ktoré potrebujete. My vám pripravíme konkrétnu cenovú ponuku.

Kontaktujte nás

Vaša práca sa nám veľmi páči a sme so stránkou spokojní :) Redakčný systém je super prehľadný a pohodlný.

Mgr. Lenka Flikingerová
konateľka www.najdimesa.sk