Wat iedereen moet weten over App Design voor Windows 8

De touchscreeninterface van Windows 8 en de verborgen navigatiestructuur zorgen voor een aantal interessante paradigmaverschuivingen in de praktijk van gebruikerservaringen.

Ik ben recentelijk bezig geweest met het hergebruik van een medische software op bedrijfsniveau voor Windows 8.1. Het was een sprong in het diepe, maar ik ben weggelopen met een aantal behoorlijk interessante inzichten. 

Dit bericht zal in grote lijnen kijken naar de zoek-, navigatie- en opmaakpatronen die gebruikelijk zijn voor native Windows 8-apps. Ik zal een aantal van mijn favoriete aspecten van elk selecteren, enkele gemaakte innovaties en mijn aanpak. Er zijn ook afhaalrestaurants voor uw eigen projecten die van toepassing zijn op elke gebruikersinterface.

Zoeken

Vóór Windows 8.1 gebruikten apps de zoekattributie om in de app te zoeken - de charmbalk is toegankelijk door naar links te vegen (naar binnen) - het is nu aan te bevelen om de zoekassing te gebruiken voor algemene zoekopdrachten. In app-zoeken op de pagina, zoals hieronder te zien:

Gebruikersinterface met zoeken op pagina

Mijn aanpak

Een goede vuistregel, vanuit een UX-oogpunt, is na te denken over het belang van de functie. We deden enkele gebruikerssessies na enkele eerste prototypen en ontdekten dat clinici sterk leidden op het doen van zoekopdrachten. 

Innovaties gemaakt

In het voorbeeld wordt het dropdown-pictogram gebruikt om het label van een knop te onderscheiden. De gebruiker kan een ander gedeelte selecteren dat voor hem van belang is om het resultaat te verkleinen.

UI afhaalmaaltijden

Voor wie bouw je het digitale product op? Is de zoekopdracht kritisch of een soort nabeschouwing? Overweeg om belangrijke functies alleen in de gebruikersinterface te plaatsen (inclusief in-app zoeken als dit de sleutel tot de UX is).

Navigatie

Ik ga je niet de hele run-down van Windows 8-navigatie geven. Een specifiek voorbeeld komt echter voor de geest: semantische zoom. Waarschijnlijk de minst bekende, maar zeer krachtig, het geeft je de mogelijkheid om gegevens in een andere context weer te geven.

Doorloop van de semantische zoomfunctie in context

Mijn aanpak

Op de 'landingspagina' staan ​​veel tegels, gesneden en in blokjes gesneden, om toegang te krijgen tot verschillende dingen, waaronder tegels die eerdere gebruikersselecties onthouden. Onze gebruikers waren afkomstig van veel verschillende klinische achtergronden, dus we moesten inspelen op die groepen door middel van maatwerk. 

Innovaties gemaakt

Semantische zoom geeft hier niet alleen een hoog niveauoverzicht van alle opties, maar geeft de gebruiker de mogelijkheid secties die ze nooit gebruiken uit te schakelen en elementen op basis van belangrijkheid te reorganiseren. In ons project waren er verschillende fragmenten in onze gebruikersgroep die maatwerk kritisch maakten. 

UI afhaalmaaltijden

Als er meer dan een paar primaire gebruikers zijn, overweeg dan om je gebruikersinterface op maat te maken. Vraag uw ontwikkelaar naar de technische beperkingen en mogelijkheden. Een samenwerkend team is veel effectiever dan een persoon die een applicatie 'ontwerpt'.

lay-out

Layout heeft tal van out-of-the-box opties beschikbaar. De inhoud en structuur van de app bepalen welke je gaat gebruiken.

Documentpagina in de app

Mijn aanpak

In het bovenstaande voorbeeld ziet u dat de geselecteerde sjabloon goed paste bij de functies voor documentselectie. De app is in feite een documentreader, dus het was logisch. 

Lay-out van patiëntenlijst

Innovaties gemaakt

Deze patiëntenlijstpagina heeft een andere lay-out gebruikt, een die meer geschikt is voor pannen en het selecteren van tegelelementen. Het feit dat lay-outs voor kritieke delen van de gebruikersstroom aanzienlijk verschillen, maar consistent zijn, is een geweldige manier om techniek te vinden, vooral omdat er geen breadcrumb-navigatie-elementen beschikbaar zijn.

UI afhaalmaaltijden

Inhoud vormt de kern van de ervaring, een grote inhoudgestuurde toepassing zal over het algemeen een hiërarchische structuur hebben, dus veel van de informatie aan het begin zal van hoog niveau zijn en naarmate de gebruiker vordert, wordt deze gedetailleerder.

Windows 8-inhoud stroomt van rand tot rand en bevat panning. Naar mijn ervaring kan dit belanghebbenden gewend raken aan oude paradigma's, maar het is gewoon een manier om de hoeveelheid ruis op de pagina te verminderen en de gebruiker te laten verkennen met behulp van aanraakgebaren.

Conclusie

Windows 8 is een uniek platform voor gebruikersinterfaces met unieke mogelijkheden en voordelen voor gebruikers die aanraking en mobiliteit nodig hebben.

Het heeft een goed gestructureerde navigatie die ontdekking bevordert en zelfs beginner-ontwerpers helpt met aanwijzingen over informatie-architectuur en wat er op en buiten de pagina moet worden weergegeven.

De beschikbare rasters, sjablonen en lay-outs zijn samengesteld door UX-experts.

Er zal echter altijd enige aanpassing zijn en het zich ontwikkelende raamwerk blijft verbeteren, zoals het standaard zoeken op pagina.

Naar mijn mening zouden veel van de ideeën in dit bericht niet alleen nuttig moeten zijn in het app-ontwerp van Windows 8.1, maar in bredere zin ook. Dit artikel heeft net het oppervlak van app-patronen voor Windows 8.1 aangeraakt. Heb je de kans gehad om naar anderen te kijken die niet in dit bericht worden genoemd? Hoe denk jij erover?