Share
De meeste gevestigde mobiele platforms hebben een set ontwerppatronen, geschreven of ongeschreven richtlijnen over hoe dingen eruit moeten zien, voelen en functioneren. Het toepassen van beproefde ontwerppatronen verbetert de bruikbaarheid van uw product, verhoogt de conversie en geeft een gevoel van vertrouwdheid aan gebruikers. Het negeren van normen zal gebruikers verwarren en frustreren en is iets dat elke ontwerper zo veel mogelijk moet proberen te vermijden.
In dit artikel bekijken we ontwerppatronen op iOS door u een aantal voorbeelden te laten zien die illustreren hoe bestaande toepassingen sommige van deze ontwerppatronen toepassen.
Kortom, een ontwerppatroon is een terugkerende oplossing die een specifiek ontwerpprobleem oplost. Omdat het terugkeert en gebruikers het vaak tegenkomen, raken ze snel vertrouwd met de oplossing die het patroon biedt.
Streep biedt een ontwerppatroon voor mobiele betalingen.Het hamburgersymbool is bijvoorbeeld een bekend ontwerppatroon geworden. We weten allemaal dat het een menu zal openen wanneer op het pictogram wordt getikt. Dit gedrag is zo diep geworteld dat het de gebruiker zou verwarren als het tikken op het pictogram in een andere actie resulteerde.
Wanneer ontwerpers geen ontwerppatronen volgen en in plaats daarvan kiezen om hun eigen oplossing te implementeren, zijn twee uitkomsten mogelijk:
Wees voorzichtig, want de grens tussen een frustrerende ervaring en een innovatief ontwerp is vaak dunner dan je zou verwachten.
Met dat in gedachten, laten we ons richten op iOS en zien hoe ontwerppatronen van toepassing zijn op het mobiele platform van Apple.
Om consistente ontwerpstandaarden voor het iOS-platform te ontwikkelen, levert Apple een document dat bekend staat als de Human Interface Guidelines of HIG. Het definieert normen waaraan ontwikkelaars en ontwerpers zich moeten houden. Voorbeelden zijn de standaard toetsenbordindeling, de datumkiezer en de statusbalk.
Ontwerpnormen zijn echter niet beperkt tot het gebruik van consistente elementen van de gebruikersinterface. Naast de release van iOS 7, schetste Apple ook hun nieuwe visie op design, die drie hoofdthema's belichaamt zoals uiteengezet in de iOS Human Interface Guidelines van Apple:
De grootste verandering in iOS 7 was de manier waarop we elementen visueel presenteren. Plat ontwerp werd geïntroduceerd bij iOS-gebruikers, wat een grote verandering was. Veel mensen vonden dat dit niet noodzakelijk een verbetering was.
Grappig genoeg, terugkijkend op iOS 6, is de algemene mening dat skeuomorf ontwerp verouderd is. Onze percepties zijn duidelijk verschoven.
Wanneer mensen wennen aan het platte ontwerp van iOS 7, betekent dit dat ze wennen aan een bepaalde visuele stijl. Anders gezegd, als ontwikkelaar zou je bij voorkeur vasthouden aan de visuele stijl van iOS 7, want dat is wat gebruikers van iOS gewend zijn te worden.
Natuurlijk gaat het niet alleen om het uiterlijk van uw applicatie. Hoe het zich gedraagt en voelt, is ook een belangrijk aspect om te overwegen. Subtiele animaties zijn een handelsmerk geworden van iOS 7. Dit heeft net zoveel invloed op het uiterlijk en aanvoelen van uw toepassing als de beelden.
De animaties die u in uw toepassing gebruikt, zijn van belang en maken deel uit van ontwerppatronen. Gebruikers ervaren en waarderen verfijnde animaties, wat betekent dat het de moeite waard is om ze in te zetten.
Het uiterlijk van pictogrammen is belangrijk. Dit is een screenshot van de iOS-applicatie van Facebook.We gebruiken veel iconografie tijdens het ontwerpproces van een applicatie. Pictogrammen zijn een belangrijk hulpmiddel voor interfaceontwerppatronen omdat ze een algemene betekenis hebben, ongeacht de context van de gebruiker.
Het correct gebruiken van de pictogrammen is een goede start voor het toepassen van ontwerppatronen, maar het uiterlijk en het gevoel van deze pictogrammen zijn ook cruciaal. We zijn vertrouwd geraakt met platte en eenvoudige iconografie. Zeer gedetailleerde iconografie betekent dat we niet aan de verwachtingen van de gebruiker voldoen en als gevolg daarvan de effectiviteit van het ontwerp breken.
Een van de belangrijkste nieuwe ontwerppatronen is het gebruik van doorschijnende elementen van de gebruikersinterface. Het vernieuwde controlecentrum is een goed voorbeeld. Apple gebruikt doorschijnendheid en onscherpte om de gebruiker bewust te maken van de inhoud op de achtergrond. Het helpt om de gebruiker context te geven terwijl ze het controlecentrum gebruiken.
Het gebruik van negatieve ruimte helpt ook om ontwerpen efficiënter en bruikbaarder te maken. Het is een van de belangrijkste componenten waardoor iOS 7 zo veel verschilt van iOS 6. Gecombineerd met een beperkt aantal hoofdkleuren, biedt dit u de essentiële ingrediënten voor doordacht ontwerp van de gebruikersinterface. Als ontwerpers en ontwikkelaars moeten we meer nadenken over de ontwerpkeuzes die we maken, zelfs de kleintjes.
Een belangrijke en wellicht controversiële verandering was de overstap naar randloze knoppen, een kritische verandering in iOS-ontwerppatronen. Het is misschien ook een van de redenen waarom iOS 7 aanvankelijk veel kritiek kreeg. Het is een meer extreme benadering van plat ontwerp. Die verandering illustreert perfect de fijne lijn tussen innovatief ontwerp en ontwerp die tot frustratie leidt.
En dan, natuurlijk, voor elementen van de gebruikersinterface, zijn er de nitty-gritty gegevens waar u rekening mee moet houden. Werkbalk- en navigatiebalkpictogrammen moeten bijvoorbeeld een klembare oppervlakte hebben van minimaal 44x44 punten. Voor pictogrammen in de tabbladen wordt 50x50 punten aanbevolen. Het maximale aantal pictogrammen in een tabbladbalk is vijf voor de iPhone en iPod Touch. Een volledige lijst met aanbevolen grootten van verschillende elementen van de gebruikersinterface is te vinden in de Human Interface Guidelines.
Hetzelfde geldt voor gebaren. Het gebruik van obscure of moeilijk te raden gebaren voor veel voorkomende acties leidt tot verwarde gebruikers. Een knijpbeweging gebruiken om een link te openen lijkt me een vrij slecht idee. Rechts?
Een ander belangrijk aandachtspunt van iOS 7 is typografie. Apple moedigt het gebruik aan van één enkel dynamisch lettertype in plaats van meerdere lettertypen.
Er is ook een duidelijke visie met betrekking tot applicatie-branding. Hoewel we gewend zijn geraakt aan expliciete branding in applicaties, geeft Apple nu de voorkeur aan merken die minder expliciet zijn in de manier waarop ze zichzelf promoten en promoten. Met andere woorden, het ontwerp of de gebruikersinterface moet de focus zijn, niet het merk. De belangrijkste kleuren en ontwerptaal van de toepassing zijn perfect om een merk op een niet-opdringerige manier te promoten.
Veel e-mailclients gebruiken een split-viewcontroller voor efficiënte navigatie.Ontwerppatronen dicteren niet alleen best practices voor ontwerpen in het algemeen, ze worden ook specifiek. Sommige apparaten hebben of vereisen verschillende normen. Sommige iPad-interfaces zijn een geweldig voorbeeld.
Popovers en split view controllers zijn bijvoorbeeld elementen van de gebruikersinterface die u niet zult vinden op een iPhone of iPod Touch. Deze ontwerppatronen zijn geschikt voor grotere schermen zoals die op de iPad, iPad Air en iPad Mini.
De popover is iets dat je niet zult vinden op een iPhone of iPod Touch. Dit is een screenshot van een popover in Apple's iBooks-applicatie.
De Tumblr-applicatie voor iOS is een goed voorbeeld van focussen op een horizontale gebruikersstroom in plaats van een verticale.Ontwerppatronen vertrouwen op gezond verstand en oefenen. Het is zinloos doel voor innovatief ontwerp wanneer de kans groot is dat je bij een gefrustreerde gebruiker terechtkomt. Blijf bij de richtlijnen wanneer ze beschikbaar zijn, gebruik gevestigde ontwerppatronen en verbeter de bruikbaarheid van uw product.
Onderzoek welke oplossingen andere applicaties gebruiken om bepaalde problemen op te lossen. Hoe gaan de meeste toepassingen om met gebruikersregistratie? Wat zijn geteste benaderingen voor het integreren van e-commerce? Hoe is sociaal delen het best geïntegreerd in een toepassing? Aandacht voor details tijdens het gebruik van applicaties is een geweldige manier om vertrouwd te raken met verschillende ontwerppatronen.
Accentsconagua