Design process
With one first round of research in iOS SAP Fiori native approach and components the first low-fidelity wireframes were created. With this the next steps were clear:
As the process of research in regards of the native implementation approach from SAP was already completed it was the moment to see how to use this with the Fundermax specialists. For that different research methods were used:
User interviews: user interviews were taken to understand the workers, mainly sales people, that will use the app to showcase Fundermax possibilities to the final clients. Twenty specialists from the company where chosen to be interviewed.
With this, the different approaches of how each of the workers could use the app showed a clear pattern and insights on how to design the app.
Personas: using the information of the user interviews four personas where crated, unifying the most similar workers in groups of five. These personas where used afterwards to define which are the common points between them which helped to start with the user journeys.
User journey: a user journey timeline was designed for each of the four personas created. With this information and seeing what features the workers might need, including the AR showcase, and comparing the low fidelity wireframes the process of creating final wireframes and a user flow started.
Besides the UX research and understanding of the corporative image including brand, geometries, physical products and other graphic resources was needed. For this an exhaustive UI research was done.
Before starting with the high fidelity wireframes and with the information of the research a user flow with the features and the low-fidelity wireframes was created to organize and structure the flow and the screens.
Using this user flow and all the information gathered it was the moment to start wireframing without losing the native iOS SAP Fiori perspective and the needs of the workers of Fundermax. This wireframes had the objective of having the possibility to create a complete product prototype to user test and show to the client.
With the prototype of wireframes we decided to start three rounds of A/B testing with the Fundermax workers. For that we prepared multiple options of testing based on the components that iOS SAP Fiori and the AR functionalities from SAP where available.
The decision of testing this only with internal Fundermax users was taken because the product was really technical and for doing an open testing a technical training was needed.
After analyzing the results of the A/B Testing the user interface design started with the components and approaches selected.
With the components and approaches clear and with the reference of the Design System of iOS SAP Fiori the user interface design was done using the branding of Fundermax.
For the first version of the Fundermax app the team provided the AR interface and the basic 3D models with which the workers used to show the new features to their clients. Afterwards a phase of creating the specific 3D models of the client buildings started.
For the creation of 3D models and renders Creo Parametric and Keyshot was used. For the implementation of the 3D on the Augmented Reality module in the app Unity and its Vuforia add-on were selected as tools.
With all the mockups approved and the 3D and AR tested and already working on the modules of the app an InVision prototype was created for the development feedback the measurements and the assets.
After this process there were standard iterations including design approvals to assure that the design and the app look exactly the same.