Počni neutralnim bojama
Pozadina, površine i tekst zauzimaju gotovo ceo ekran, zato ih izaberi prve. Siva s blagim tonom glavne boje deluje promišljenije od čiste sive i pušta boju brenda da se istakne samo tamo gde je to važno.
Odredi boje stanja odmah na početku
Svakoj aplikaciji su potrebne boje za grešku, uspeh, upozorenje i informaciju. Izaberi nijanse koje se slažu s paletom i boju greške ne koristi ni za šta drugo, na primer za dugmad brenda. Dopuni boju ikonom ili tekstom kako poruka ne bi zavisila samo od boje.
Osmisli i tamni režim
Većina telefona podržava tamni režim i mnogi korisnici ga imaju uključenog. Nije dovoljno obrnuti boje: koristi veoma tamne sive umesto čiste crne i malo smanji zasićenost akcenata kako ne bi treperili na pozadini.
Proveri kontrast i dodirne površine
Tekst bi prema WCAG-u trebalo da ima kontrast s pozadinom od najmanje 4,5:1. Dugmad moraju da izgledaju drugačije kada su aktivna, pritisnuta ili isključena. Isprobaj aplikaciju napolju i pri niskoj osvetljenosti, jer je tako koristi mnogo ljudi.
Česta pitanja
Koliko boja bi aplikacija trebalo da ima?
Obično jednu glavnu boju, opcionu boju akcenta, neutralne boje za pozadine, površine i tekstove i četiri boje stanja: greška, uspeh, upozorenje i informacija.
Koju boju koristiti za glavno dugme aplikacije?
Glavnu boju tvog brenda, ako je u dobrom kontrastu s pozadinom. Koristi je samo za najvažniju radnju na svakom ekranu.
Kako napraviti tamni režim palete?
Pozadina postaje veoma tamna siva s blagim tonom boje brenda, površine su malo svetlije od pozadine, a akcenti se posvetle i ublaže. Tekst prelazi u prljavo belu. Kod svakog primera to ćeš videti kada klikneš na dugme „Tamni”.
Koju paletu izabrati za minimalističku aplikaciju?
Osnovu od sivih (gotovo bela pozadina, veoma svetlosive površine i gotovo crn tekst) s jednom jedinom bojom akcenta za ono važno. Tu ideju prate palete u kategoriji „Minimal”.
Kako da prenesem paletu u Figmu, Flutter ili SwiftUI?
Kod palete klikni na „Izvezi” i izaberi format: JSON tokeni za Figmu, ColorScheme za Flutter, boje sa svetlim i tamnim režimom za SwiftUI, Tailwind ili CSS promenljive. Kod kopiraš jednim dodirom.