<![CDATA[Ruben van den Hout | Digital Product Designer]]>http://fransruben.io/http://fransruben.io/favicon.pngRuben van den Hout | Digital Product Designerhttp://fransruben.io/Ghost 3.2Fri, 08 May 2020 19:46:39 GMT60<![CDATA[Simplify crop growing]]>http://fransruben.io/crop-cycle-managment/5eaf24f97963b106a7b6c101Sun, 03 May 2020 22:05:07 GMT

Automate plant growth by creating a climate recipe for each grow phase of your crop

Client

Priva

Year

2020

Responsibilities

UX Research & Design
Simplify crop growing
Simplify crop growing
Simplify crop growing

Priva is worldwide market leader of climate computers for greenhouses in horiculture. Advanced measurement and control systems create the optimal growing conditions for vegetables, flowers and soft fruit. Crop cycle manager is one of the first digital services that aims to simplify growing by repeating control settings as recipes based on the growth phases of a crop.

How it works

Climate computers are used to control in periods of 24hrs and repeat their settings every day. However, many plant varieties grow in stages that require changes in grow settings at specific days during its development. Crop cycle management automates this process to prevent mistakes and enable effective climate management for businesses that grow many different crops at the same time.

Simplify crop growing

Focus on crops instead of the technical installation

A climate computer controls a technical installation, but a grower is only concerned with the development of his crop. Crop cycle management brings the crop in focus and abstracts the installation to create conditions based on how growers think instead of how the computer works.

Simplify crop growing

Repeatable climate strategies

Each variety has its own specific growing conditions that maximize quality and production. As a first step we made a place to create and save settings in a recipe that can be reused on a new crop.

Simplify crop growing
Simplify crop growing

Usability testing

The first mockups have been tested with 5 growers to understand whether this implementation is useful and if it fits their mental model of growing in phases.

More to come

The project is still under development so this is a sneak peek of the progress we have made so far. As with any new endeavour it might fail and it will definitely change, but the only way of finding out is to bravely continue.. ;)

Simplify crop growing

]]>
<![CDATA[ASN Banking App Redesign]]>http://fransruben.io/asn-redesign/5e00bed178eb95040487b7bcSat, 02 May 2020 13:20:00 GMT

Personal mobile banking reimagined as a trusted, seemless experience - a case study.

Client

Personal Project

Year

2020

Responsibilities

App Review & UI Design
ASN Banking App Redesign
ASN Banking App Redesign

ASN is a consumer bank with a mission to foster environmental and social sustainability. Their strong sustainable values set it apart as a responsible and human way of banking. In 2016, ASN redesigned their website to embody these values with a modern, spacious layout and a personal tone of voice. However, in the last 4 years the mobile application has not been changed for the better. Therefore, as a loyal user of the mobile app, I used it as a case study to reimage the ASN mobile banking experience.


Userflow

I started with an analysis of how frequent user tasks are executed with the current mobile app. To scope the analysis, I focussed on (1) making a payment, (2) requesting a payment and (3) viewing account and transaction details. Based on the navigation structure and information hierarchy, I have identified three main opportunities for improvement:

  1. Payment requests have a fragmented userflow. It is divided between "Overview" and "Transfer" and only accessible through secondary navigation.
  2. The Transfer page behaves differently from all other menu items. It requires an extra secondary choice of the type of transfer that unnecessarily complicates one of the most used tasks.
  3. Although ASN puts a high value on personal communication, there is no personalized area in the app. A profile area would also be useful to group options like settings, and messages and offer personalized content.
ASN Banking App Redesign
Userflow of ASN Banking app

User Interface

A review of the user interface screens revealed that some simple improvements could help users to better find what they are looking for, prevent mistakes and grow confidence in the mobile banking experience.

ASN Banking App Redesign

Improvement opportunities

A thorough review of the user flow and user interface revealed improvement opportunities that can be summarized in the following three themes.

ASN Banking App Redesign

Sign in with clarity and confidence

The login screen now features a light background with more space for the keypad and clearly labeled functions to view balance and get help. Accounts are made personal with names and profile pictures and "Eppo" the squirrel features on top as the trusted brand mark, so you always know you are in the right place.

ASN Banking App Redesign

Accounts at a glance and quickly make a payment

Accounts are more legible with increased spacing and a strong display of the current balance. Pay via transfer or with a QR-code are prominent options in two floating action buttons that are within easy reach. The account details show a clear hierarchy and repeats the strong action button to transfer funds. The transaction list now puts emphasis on the name and amount instead of the icons and only the negative transactions.

ASN Banking App Redesign
ASN Banking App Redesign

Prevent mistakes in transactions

The amount is highlighted on top and not buried somewhere in the list of details you need to fill out of a transaction. Instead of nervously triple checking the account number, a profile picture could give extra reassurance that your money ends up where you want.

ASN Banking App Redesign
ASN Banking App Redesign

Branding

The most visible decision was to use red as a primary color instead of the current green. Red is visually stronger and also the primary color on the rebranded website of ASN. An additional benefit is that is better distinguishes ASN from other banking apps that also use green as primary color like ABN Ambro and Kendu. Colors and typography are copied from the website branding and a new icon set completes the visual style.

ASN Banking App Redesign

Conclusion

To be honest, it does not take much to better connect the mobile experience with both the users and the ASN brand. The ingredients are already there and hopefully this case study shows how they can be combined to create a memorable user experience.

]]>
<![CDATA[Virtual Reality Laboratory]]>http://fransruben.io/virtual-reality-laboratory/5eaec4a77963b106a7b6c09cFri, 01 May 2020 13:23:00 GMT

Explore, learn and create using cutting edge tools for virtual and augmented realities.

Client

University of Twente

Year

2014 / 2020

Responsibilities

UX Research & Design
Virtual Reality Laboratory
Virtual Reality Laboratory
Virtual Reality Laboratory

The Virtual Reality Laboratory of the University of Twente offers students and reseachers modern tools to collaborate with augmented and virtual realities. Over time, the growing opportunities of new technologies have come at the cost of usability. This project aims to democratize the vr-lab by supporting the independent use and exploration of the vr-tools and thereby create an open and accesible place for collaboration.

The research and conceptual design originated in 2014 in my bachelor graduate assignment. Recently I have updated the visual design to demonstrate newly acquired skills in a relevant context.

User Research

The vr-lab is a place that is used by students, researchers and broad range of external companies. Each has their own objectives and expectations of what the lab has to offer. To get started in the right direction, I have conducted 5 interviews with representative users to discover what they try to accomplish and what their specific needs are in reaching their goals. Three main research questions:

  1. Who are the main users of the vr-lab?
  2. What are their main jobs?
  3. What are the primary pain points in using the virtual reality lab?
Virtual Reality Laboratory

The needs focus on exploration, collaboration and identification of issues. To most users it is not clear how devices in the lab are related, which makes it hard to create a mental model that helps to operate the lab. Moreover, controls are distributed over multiple systems, accessible through different interfaces and provide little feedback. Most of these problems are interrelated and boil down to the need of a single, clear and transparent overview of the lab's controls and status.

Virtual Reality Laboratory
Virtual Reality Laboratory

Immersive experience with explicit navigation

The central idea of the solution is to use a 3D model of the vr-lab itself to operate and explore. Now a user does not need to understand the underlying relations, but instead can simply point to a device and directly change settings. I used low-fidelity wireframes to test two alternatives to structure the navigation. In total 8 users participated in a moderated usability test.

The results show a difference in the number of mistakes users make, but the sample size is too small to draw definitive conclusions. However, I measured a clear learning effect showed by the cumulative task completion time decreasing for both concepts. I went further with concept A, because it better shows the relation between the settings and the 3D model as interface.

Virtual Reality Laboratory

The lab itself as a VR experience

The 3D model allows interactive discovery of the lab’s devices and settings. It is here designed for exploration on a tablet, but in the future the setup is suitable for a VR walkthrough which can be done remotely. This is especially interesting for external companies that want to get a feel of what the vr-lab has to offer.

Virtual Reality Laboratory
Virtual Reality Laboratory

Save states and return to them in an instant

A frequent scenario that emerged from the interviews is that a user configures the vr-tools and environment to start a collaborative session. They often want to use the same settings they had before to continue the work they started. This is now possible with presets that save the entire state of the lab to quickly return to a previously used environment.

Virtual Reality Laboratory

Shared view on availabiliy and performance

Access to a shared calendar within the app provides a simple overview of appointment. Because parts of the lab can be used independently, the areas are defined as rooms in an office. Each area can be booked seperately or the whole lab can be reserved for larger work sessions.

Dashboard graphs give insight in the usage of the lab so it is possible for support personel to identify common issues and continuously improve.

Virtual Reality Laboratory
Virtual Reality Laboratory

Results

You have seen an analysis and some key solution concepts to improve the accessibiliy of the virtual reality laboratory. So far it has been a largely conceptual exercise of which the basic interaction has been validated with end-users. The concept was positively received by the stakeholders and an other graduate student will continue the work to build a platform that brings this closer to reality.

]]>