Role: UI/UX Designer, Frontend Developer
Date: Q4 2021
Tools: Figma, Visual Studio Code
Technologies: JavaScript/Vue.js, HTML, CSS/SCSS, PHP/Wordpress
iPhone devices take photos in HEIC format by default. This HEIC Converter allows iPhone users to convert HEIC photos to JPEG.
Sometimes, when attempting to upload photos to a website, the website will not allow you to upload the photo because it is HEIC format. Alternative HEIC to JPEG converting websites have poor user experiences, look sketchy, or both.
The typical user for an HEIC to JPEG converter is someone who is frustrated with the inability to upload a HEIC photo from their iPhone. They want something quick, easy, and secure.
I took on this project alone; researching, prototyping, and implementing it in just a few days. Prototyping was completed in Figma, and the product was implemented utilizing Vue.js within a WordPress plugin.
Users needed to be able to upload as many files as they wanted, and the conversion needed to happen on their device, so that the photos they are converting aren’t sent across the internet. The design needed to be simple and easy to understand, as well as be easy to implement in a short amount of time.
I researched existing conversion websites, to see what they did well and not so well. I immediately noticed that ads took up most of the user interface on existing solutions, and that they seemed to be very insecure; or gave off the impression of being insecure.
The design of the converter is very simple. A file upload field, where users can choose or drag-and-drop files they wish to be converted, and accompanying information to put potential users at-ease. Many converter sites have caused users to be anxious about uploading their files to a random converter site, so putting reassurances front and center was necessary.
I ran usability tests on my sister, fiancé, and soon-to-be father-in-law. An oversight in my initial prototypes and research was the lack of a progress bar. Users were often anxious and feared that a long-running conversion had failed because they were given no indication if the conversion was still happening.
My goal of designing an easy-to-use and secure converter was successful, however simplicity of design got in the way of the usability of the experience. Users want immediate and constant feedback with long-running tasks.
