Overview
MetaOptima Technology is a digital health company founded in Vancouver, Canada that strives to empower patients and medical experts with intelligent solutions for better patient outcomes. The company is dedicated to revolutionizing the dermatology and skin care industry with advanced, effective, and intelligent tools.
MetaOptima’s primary technologies include MoleScope™, a
mobile dermoscope that attaches to popular smart devices to capture medical-grade
quality images for skin imaging; and DermEngine™, an
intelligent dermatology software for the imaging, documentation and diagnosis of skin
conditions including skin cancer. Powered by artificial intelligence, this smart
dermatology system helps medical professionals manage their busy workflows with secure
cross-platform access so they can focus on their patients - not the process.
The DermEngine platform has gained international attention, ranging from being featured on several articles by Simon Fraser University, Medium, the Vancouver Sun, and the Canadian Broadcasting Corporation to being highlighted on the Italian national morning news segment. The platform was also awarded a contract funded by Canada's Build in Canada Innovation Program for DermEngine to be used voluntarily by the Royal Canadian Mounted Police (RCMP) employees for remote skin screening.
During my time at MetaOptima, I was the only designer in the company, thus allowing me to work directly with our team of developers, engineers, researchers, and the C-Suite on most of my designs. These projects ranged from assisting with testing, creating UI and UX experiences, designing and marketing the product as well as helping with the launch of both the mobile app and the web platform. I commenced by designing icons, UI assets, diagrams, and marketing and sales material. However, as the years progressed I started to take on bigger projects such as creating all the designs and assets to support all three business teams in Canada, the US, and Australia.
Similarly to MoleScope and the rest of the MetaOptima products, I managed and created all the branding, visual, and graphic design related projects including all printed material along with preparing and coordinating files for quoting and printing with third-party companies, exhibition booth design and logistics, live demos at conferences as well as producing freebies and employee swag.
In addition to all print material, I worked digitally by enhancing images, creating wireframes, mockups, diagrams, user flows, and graphics to be utilized on business proposals, trade shows, and the website. I also assisted in some UI/UX design and iconography for DermEngine’s mobile and ipad apps for medical professionals while translating the apps, some videos, and customer support emails into Spanish.
Being the only designer gave me the chance to work on several types of projects with every team in the company. My projects ranged from graphic design tasks for marketing and sales material to icons and ui/ux designs for the platform and app. Each project had its challenges and processes, depending on the task and team or department I collaborated with, so the process fluctuated from time to time. However, I try to keep the general workflow consistent with all my projects.
For most of the UI/UX and mockups related projects I worked on, I tried following these steps:
For most of the graphic and print design related projects, the process I followed can be found in the MoleScope project process section.
A few rounds of iterations occur doing the process of creating icons and mockups to accomplish set goals. Due to differences in approaches, when needed, I explain some of my design decisions to discuss with the front end team to make sure specific ideas are achievable in a reasonable time. Coworkers usually provide any feedback through Slack, meetings, and comments on any shared document or file depending on the number and length of each edit.
After some feedback and discussions, I iterate the design and share it again with the team for another round. This process happens a few times until we reach a final design that accomplished the said goal. The front end is usually the team doing the testing for specific features or projects.
DermEngine is an intelligent cloud-based analytical dermatology software for the imaging, documentation, and analysis of skin conditions including skin cancer. Powered by artificial intelligence (AI), this smart dermatology system helps medical professionals manage their busy workflows with secure cross-platform access. DermEngine works seamlessly with MoleScope™, an innovative award-winning mobile dermoscope (mini-microscope) attachment that provides a high-resolution, detailed view of the skin through magnification and specialized lighting.
DermEngine
The team used a combination of the MoleScope app for patients and the DermEngine web platform to start creating the physicians' app as we wanted to create an app that was similar and complementary to the one their patients will use. The decision was not only for branding purposes but also for them to be able to walk their patients through specific workflows if needed. With that in mind, all new screens and features were implemented to create better and newer versions to accommodate medical professionals and their growing needs.
While working with the iOS developer, I designed and created various icons, ui elements, and screens to translate some of the web platform’s interfaces into more intuitive mobile versions. These included creating mockups, designing, and testing different workflows and experiences such as the ability to compare two lesion images as well as the need to add diagnosis to those lesions for future reports.
At last, I collaborated with the iOS developer at the start of the iPad version of the app. A few of the screens and experiences I worked on were the idea of sliding some of the screens out and having it take up half the space while being able to look at another screen rather than a smartphone experience of just showing one screen at a time but in a larger version.
I designed a handful of icons, illustrations, and ui elements for the web platform while also assisting both the front end and mobile teams with a few mockups and testing sessions to find bugs and opportunities for ui and ux improvements.
The DermEngine website is the company's main website since the focus is to provide an intelligent software powered by AI to experts in the healthcare industry such as dermatologists, oncologists, and general physicians. The company provides B2B and B2C models to different clients depending on their interests; therefore, the content has to accommodate those needs.
I was assigned to help with brainstorming ideas and coming up with wireframes for the homepage, a few web pages, as well as landing pages while I worked closely with the front end developers to develop these sites. Aside from that, I managed the branding for all the visual design and created all the visuals and icons.
Apart from the main projects mentioned above, there were other individual projects I was responsible for designing and creating. An example is an appointment booking webpage and workflow for specific projects and services the company provides to clients with a white label customized option.
DermEngine was an undergoing project when I joined MetaOptima, so I was tasked to create and manage the branding in addition to all the needed material for the release of the product and onwards. My focus was to create many marketing materials for all possible needs, such as internal and external presentations, exhibitions, conferences, master classes, online advertisements, sales material, and so forth.
The first and most important challenge was to figure out how to present what DermEngine was and the tone and style we wanted to pursue to start creating brand awareness. Since DermEngine took a new approach to the classic electronic patients' management, we had a lot to do for industry experts to notice and trust us as a new competitor in the market.
Aside from working and assisting with several videos in English, I worked on the Spanish translations and visuals like illustrations and images for the below videos to be used as promotional and educational videos:
When I joined, the team merely started to build DermEngine as a platform and did not have a name yet, meaning it was a brand new project for everyone. I was tasked with creating the entire branding and visual direction while also helping with iconography, ui/ux design, and testing. Being able to work with a cross-functional team for this project since the beginning meant I was part of the brainstorming session and contributed to the platforms’ direction, which is something I enjoy doing as there are wireframes, mockups, and usability testing involved. DermEngine is a specific cloud-based platform targeted to medical experts that provided me with the chance to learn about the healthcare industry including what specific physicians need and how they work together.
I enjoyed my first few years working with the front end and mobile team that I would have liked to be more engaged in projects with them. If given the chance, I would spend more time involved with the making and improvement of the platform by providing industry knowledge regarding user experiences, human-computer interactions, and psychology on users. Similarly to MoleScope, if the company allocated more budget, I would like to assemble a design team to support and create a variety of projects for the internal teams to use as well as all the partners and clients.
I'm proud of every DermEngine project I was a part of in the past 5 years, even though I became more involved in graphic and visual design projects than the production of the product. DermEngine is a massive project in itself that prepared and retaught me to think outside the box, design under tight deadlines and requirements, come up with new ways of working with ever-changing colleagues and requests, and much more.
If you would like to read a more in-depth reflection about my experience with DermEngine, the projects I worked on, and my time at MetaOptima working on a number of projects for the company, I’ve created a section in my MetaOptima study case page. To read about it, click here.
Reflection