I’m happy with the final branding of the prototype, and tested the text field input in combination with it to see how it works in animations:


As the branding is taking its final shape, I have ran into other problems when assembling the final prototype. These problems are caused due to the limitations of ProtoPie. An example of a smaller issue I managed to overcome was layering multiple large reference images over each other. The changing the opacity value created issues with button hit areas, and thus I had to create a paging scroll that travels to the assigned image to solve the problems with the interaction.  The transition is not as smooth, but the interaction was the priority. The following video demonstrates the difference:


Later I ran into a bigger issue, as the Android phone I’m using to demonstrate the prototype has a very high resolution. This means that the image quality in the prototype needs to be very high to prevent heavy pixelation on the device screen. In the end the prototype had too many images and become too heavy to run smoothly. Since the prototype includes multiple screens and images, the file size became too large and caused problems when saving, crashing the prototyping tool and the prototype on phone multiple times. When trying to solve the problem I tried changing the resolution of the prototype as well as the density of the rendering, but as ProtoPie converts vector images into bitmaps the images pixelated heavily on the device screen. I went back and forth with the ProtoPie customer support, but in the end I simply needed to reduce the quality and fidelity of the application to maintain a smaller file size. This means I had to split the prototype into multiple different files to ensure all interactions could be run, as one large prototype required too much processing power. It is unfortunate I cannot exhibit all the full features and routes I created and assembled for the prototype, but I will display videos in this blog to show them and leave only the core user journey for the live prototype demonstration. Even then I need to compromise the image quality in the prototype and split the resolution to ensure the prototype’s interactions can be run as intended. Similarly, not all gallery images will open in the live demo, as mapping the full prototype would have required too much from the prototyping tool and from the ProtoPie engine.