Share
Nou, als je de eerste vijf artikelen in deze serie hebt gelezen, vraag je je misschien af: "Hoe verhoudt dit alles zich tot mobiel ontwerp?" Het doel van deze introductieserie is om nieuwe hulpmiddelen en ideeën toe te voegen aan je mobiele ontwerparsenaal. Dit artikel is niet anders. Kleuren kunnen uw applicatie er professioneel en mooi uit laten zien, maar aan de andere kant kunnen ze het ook laten lijken alsof uw app is gemaakt door mijn vijf jaar oude neefje.
Ik ben niet van plan om je een professionele ontwerper te maken in deze cursus, maar als je de grondbeginselen van de kleurentheorie kent, kun je je apps echt naar een hoger niveau tillen, zelfs als je de hele app-interface in code wilt maken.
Als het gaat om het begrijpen van de kleurentheorie, is wat volgt de eenvoudigste manier waarop ik het voor je kan opsplitsen.
Rood, geel, blauw. Dit zijn de drie basiskleuren die niet kunnen worden gemaakt door een combinatie van andere kleuren. Alle andere kleuren zijn het resultaat van het mengen van deze drie.
Groen, oranje, paars. Dit zijn de kleuren die worden gevormd door de primaire kleuren te mengen.
Geeloranje, roodoranje, roodpaars, blauwpaars, blauwgroen en geelgroen. Dit zijn de kleuren die worden gevormd door een primaire en een secundaire kleur te mengen. Met andere woorden, het vult de rest van ons kleurenwiel in.
Elke drie kleuren die zij aan zij staan op een 12-delig kleurenwiel, zoals geelgroen, geel en geeloranje. Gewoonlijk is een van de drie kleuren de dominante kleur.
Met betrekking tot het kleurenwiel zijn complementaire kleuren twee kleuren direct tegenover elkaar, zoals rood en groen. Complementaire kleuren creëren een maximaal contrast en maximale stabiliteit. Wees voorzichtig bij het werken met volledig verzadigde complementaire kleuren voor digitale interfaces: ze kunnen overbelast raken.
Hier is nog een van mijn kleine geheimen die ik je zal laten zien en ook waar ik de graphics van heb gepakt. Dit is een geweldige site die je helpt om wat harmonie te brengen in je app.
Bijkomende kleuren zijn de inhoud van internet, televisie en mobiele apparaten. In Photoshop maken we alle app-schermafbeeldingen, achtergronden en afbeeldingen in RGB-indeling. RGB staat voor rood, groen en blauw, en deze drie zijn de additieve primaire kleuren. Wanneer verschillende combinaties van deze drie met elkaar worden gemengd, worden alle resterende kleuren gemaakt. In Photoshop kunt u de RGB-kleur beheren door op het kleurenpalet te dubbelklikken. De twee meest voorkomende manieren om de kleur aan te passen in Photoshop is om numerieke RGB-waarden rechtstreeks in tekstvelden in te voeren of om de kleurenkiezer eenvoudig over het kleurenpalet te slepen.
Op een schaal van 0 tot 255 verandert elke numerieke stap de kleur op een subtiele manier. Gewoon om het onder de knie te krijgen, er is niets subtiels aan de onderstaande verschillen!
Een RGB-waarde van 255, 255, 255 (volledige verzadiging) is hetzelfde als wit, dat ook de hexwaarde van #ffffff laat zien.
Als daarentegen alle RGB-waarden zijn ingesteld op nul, is de gegenereerde kleur zwart. Dit toont de overeenkomstige hexwaarde # 000000.
Als je er wat meer in betrekt, zou je moeten kunnen voorspellen welke kleur zal worden gegenereerd wanneer Rood is ingesteld op een waarde van 255 en Groen en Blauw zijn ingesteld op 0.
Desalniettemin kon ik een andere screenshot niet weerstaan. Met een waarde van 255 in rode stip en 0 in de groene en blauwe kleur krijgen we een volledig verzadigde rode kleur. Groen en blauw veranderen dienovereenkomstig met dezelfde waarden herschikt.
Als een voorbeeld van wat er gebeurt als we beginnen te rommelen met meerdere verschillende waarden, met een waarde van 255 in rood en groen, maken we een volledig verzadigde gele kleur met de hexadecimale waarde # ffff00.
Door alleen de waarden Rood, Groen of Blauw te wijzigen, kunnen we dus de exacte kleur maken die nodig is voor het ontwerp bij de hand. Weten hoe kleuren met elkaar omgaan, zal uw toepassingen en websites echt helpen om wat meer harmonie en samenhang te tonen.
Dus nu komt het leuke gedeelte. Met de algemene theorie op de manier, hoe weet u welke kleur het beste is voor uw app? Kleuren kunnen verschillende effecten hebben op mensen en kunnen zelfs verschillende culturele betekenissen hebben die verder gaan dan wat van nature intuïtief kan zijn. Van rood is bekend dat het de bloedcirculatie verhoogt en ons lichaam en geest stimuleert. Om deze redenen wordt het daarom vaak geassocieerd met seks en liefde. Van Oranje is bekend dat het de algehele energie verhoogt. Blauw kan worden gebruikt om pijn te behandelen en staat bekend als een stimulerend middel en kan vaak worden toegeschreven aan slapeloosheid. Houd dat in gedachten de volgende keer dat je naar dat kleine blauwe licht op je televisie staart!
Weten hoe mensen van nature op kleuren reageren, kan een belangrijke schat aan informatie zijn om in je achterzak te houden. Kleurassociatie en kleurenpsychologie gaan hand in hand en beide zijn het waard om verder onafhankelijk onderzoek te doen voor de serieuze ontwerper.
Een site waar je van zou moeten genieten en die beslissingen over beslissingen over kleurassociaties versnelt, is http://colorapi.com. Zoek naar een woord, laten we zeggen, brood, en je krijgt een heleboel kleuropties voor die bakkerij-app waar je aan werkt. Genieten!
Ik ben een groot voorstander van toegankelijkheid en kleur speelt een grote rol in de algehele toegankelijkheid van zowel websites als mobiele applicaties. Door voldoende contrast te bieden tussen achtergrondkleur en pagina-elementen, zorgt u ervoor dat iedereen van uw toepassingen kan genieten zoals u van plan bent om van hen te genieten.
Bekijk http://colorfilter.wickline.org/ om te zien hoe uw site of webtoepassing eruitziet voor slechtzienden..
Hier zijn een paar apps die het goed deden. Kijk eens naar de website die u zou zien als u deze vanaf een desktopcomputer bezoekt en vergelijk hem met die van de mobiele applicatie. Beide dragen een consistent uiterlijk, gevoel en kleurenschema. Continuïteit tussen website en web-app is net zo belangrijk als kleurenschema (maar die discussie is voor een andere keer).
Het gebruik van een blauwe kleur geeft de site een mooie kalmerende en cool ogende site. Niet cool als in surfer-boy jargon, maar wel cool als in temperatuur, dus de thermometer-app. Werkt goed.
Ik vind deze leuk. Kelder trekt een mooi effect af met bruintinten om de site en app een natuurlijk en geruststellend gevoel te geven. Zoals een echte wijnkelder met mogelijk onverharde vloeren en houten planken en muren, was bruin hier echt de voor de hand liggende keuze.
Net als de thermometer-app geeft de mobiele versie van arctic.ru een mooie coole look met de blanken, blues en grijzen. Het is altijd een goed idee om koele kleuren op een site met ijsberen af te beelden. Omgekeerd zou een site voor Las Vegas of Arizona of warmere tropische klimaten meer succes hebben met warme kleuren zoals rood, sinaasappels en geel.
De volgende keer gaan we terug naar Photoshop en leren we basisvormen en -knoppen maken. Blijf kijken!
Accentsconagua