Mobiele app-thema's verbeteren de gebruikerservaring
Mobiele app-thema's verhogen de gebruikerstevredenheid doordat elke gebruiker het uiterlijk van de app kan aanpassen aan persoonlijke voorkeuren. Een manier om meerdere thema's in apps te implementeren die data presenteren en visualiseren, is door gebruikers een keuze aan te bieden uit verschillende kleurenpaletten voor grafieken en diagrammen. MobileTogether maakt gebruik van een combinatie van een intuïtieve gebruikersinterface met drag-and-drop functionaliteit, de krachtige visuele programmeertaal Action Tree voor het afhandelen van gebeurtenissen, en gestandaardiseerde functionele programmering voor het selecteren en verwerken van data. Ontwikkelaars gebruiken MobileTogether dagelijks om stijlvolle, platformonafhankelijke apps te creëren met uitgebreide grafieken en diagrammen in alle gangbare formaten.
De belangrijkste instellingen voor het uiterlijk van grafieken geven mobiele app-ontwikkelaars de mogelijkheid om uit vier vooraf gedefinieerde kleurenpaletten te kiezen, of zelfs een eigen kleurenpalet te definiëren voor grafieken en diagrammen tijdens het ontwerpen van een app. In combinatie met de instellingen voor donkere modus en lichte modus, creëert dit tien verschillende mogelijkheden voor het aanpassen van de weergave. In plaats van een bepaalde kleurstelling voor te schrijven, kunnen ontwikkelaars gebruikmaken van de functies van MobileTogether om gebruikers zelf de keuze te laten. Laten we eens een voorbeeld bekijken.
De afbeelding hieronder toont het selectievenster voor het kleurenschema "Mobile Together" en een grafiek uit een mobiele app die de productie van zonne-energiesystemen op daken weergeeft.
De ontwikkelaar heeft een aangepast kleurenschema ingesteld in het dialoogvenster voor grafiekinstellingen. Hierbij is het gebied van de grafiek gevuld met oranje en zijn de balken blauw. Als de grafiek extra elementen zou bevatten, zouden de volgende kleuren groen, geel, paars, enzovoort zijn.
De ontwikkelaar kon elk van de vooraf gedefinieerde kleurenschema's selecteren via het dropdownmenu:
Het maken van thema's voor mobiele apps
Laten we een strategie bekijken om gebruikers op elk mobiel apparaat de mogelijkheid te geven een kleurenschema te kiezen wanneer de app wordt uitgevoerd. Deze app heeft al een instellingenpagina, dus dat is een logische plek om een selectieoptie voor visuele thema's toe te voegen. We kunnen beginnen met het maken van een tabel met radiobuttons en kleurenpaletten voor elk kleurenschema. Hier is een weergave van de voltooide tabel in de MobileTogether Designer:
MobileTogether ondersteunt alle bekende selectiemogelijkheden. Zo verschijnt bijvoorbeeld een combobox direct boven de tabel. We hebben gekozen voor een set radiobuttons voor de thema's van de mobiele app, zodat alle kleuropties tegelijkertijd kunnen worden weergegeven.
De grafieken in deze app bevatten slechts één of twee elementen per stuk, waardoor elk kleurenpalet de eerste twee kleuren in de lijst weergeeft voor elk schema. Hieronder ziet u een weergave van hetzelfde gedeelte van de instellingenpagina in het venster van de MobileTogether Simulator:
Het hoofdvenster voor het instellen van grafieken stelt ontwikkelaars in staat om snel de beste grafiek te ontwerpen om vrijwel elke dataset visueel weer te geven, inclusief staafdiagrammen, kolomdiagrammen, candlestick-diagrammen, meetinstrumenten en cirkeldiagrammen. Grafiektypen kunnen zelfs in lagen worden gecombineerd. Het maandelijks productieoverzicht dat hierboven wordt weergegeven, is een gelaagde grafiek met een staafdiagram als overlay.
Maar elk individueel element van een grafiek kan ook gedefinieerd worden als het resultaat van een XPath-expressie die tijdens de uitvoering van de applicatie wordt verwerkt. Instellingen die in het dialoogvenster "Dynamische XPath-instellingen" worden aangepast, overschrijven de oorspronkelijke basisinstellingen van de grafiek.
Het dialoogvenster "Dynamische XPath-instellingen" stelt ons in staat om het kleurenschema voor elk diagram te specificeren, via het XML-element met de naam "graphColorBase". De tabel met radiobuttons op de pagina "Instellingen" van de applicatie wijst een van de volgende stringwaarden toe aan "graphColorBase": "Standaard", "Grijstinten", "Kleuren", "Pasteltinten" of "Gebruiker".
Hieronder staan screenshots van de uiteindelijke app, die de selectie van mobiele app-thema's op een Android-telefoon in donkere modus laten zien
En voorbeelden van het standaard kleurenschema en het grijsschaal kleurenschema op een iPhone in de lichte modus:
Het kleurenschema in grijstinten kan ideaal zijn voor mensen met kleurenblindheid!
Bekijk onze MobileTogether videodemonstraties, meer Voorbeeldapplicaties, of zelfs de online handleiding Voor een uitgebreide uitleg over alle informatie met betrekking tot MobileTogether. Wanneer u klaar bent om de gebruikerservaring van uw mobiele apps te verbeteren met behulp van thema's, in uw eigen cross-platform applicaties, Download de MobileTogether Designer.