Creating an AI-generated health monitoring app for young adults

Process   ·   21 June 2020   ·   13 min read

Creating an AI-generated health monitoring app for young adults

Process   ·   21 June 2020   ·   13 min read

Creating an AI-generated health monitoring app for young adults

Process   ·   21 June 2020   ·   13 min read

Creating an AI-generated health monitoring app for young adults

Process   ·   21 June 2020   ·   13 min read

Ideation

Whilst going through this corona period, I started to think that after this crisis, more things will be digitalised even faster. Though digitalisation and AI already have been a trend, more of these will be coming up. Considering the time we are living in and with these trends, I thought it is a perfect chance to create an app for this. It was possible to find many news or posts of people who were scared if their symptoms are coming from corona and even if it is a symptom that isn’t related to corona, they are scared to visit GP. Nonetheless, due to the shortage of workers and facilities, it is not recommended to visit GP unless it’s very serious and not related to corona symptoms and GPs are too busy that can’t pick up their phones. Many foreigners went back to their countries because of this.

 

In this situation, I thought of a healthcare app for young adults who are relatively healthy and want to stay healthy. It is an app to monitor their health such as activities, weight, sleep cycle etc by themselves daily and have 3-6 monthly check-up with online GP by having a self-check kit so they can improve their health while staying healthy as usual. Also, when they happen to be ill, usually it’s not something serious, so they can just quickly see their online GP and have the medications delivered. This way, more people will be able to stay healthy and save their time and there will be more spaces available for patients who actually need help and care.

 

Before actually research or go into the project itself, I felt like I needed to study more about UX/UI. After Affo, my interest in UX/UI went up and after looking up some information of the job, I’ve realised that I need another portfolio. That I can’t really apply for any internship with graphic design portfolio with no proper UX/UI elements. So I looked up for some quick course explaining basic methodologies of UX to briefly understand what I need to create.

Research / UX

Firstly, like always, I started with basic research of my users and healthcare apps. When I searched for existing healthcare apps and general images of healthcare, most of them used green, blue and purple but cool-toned colours. Maybe those colours were used to provoke logical and reliable images, however, at the same time, I felt like it also brings the image of coldness. From our childhood to until we die, hospital is not a place they want to be at and they are scared to be ill. Because I aim to target relatively healthy age groups, 18-34 and maximum 40 and because this app’s purpose is not to get treatment, instead it is to prevent being ill by monitoring everyday health, I thought I could change that image.

 

I thought it might worth to come up with this app. There are many online-GP apps and many health tracking apps but there is not many GP + health tracking app for prevention purposes. Most of GP services happen after people get ill and same with Health app from Iphone, which it sends the detail of the patient’s health records and daily tracks to the hospital but only after getting ill. While I’m in this crisis, because I’m young, I’m not in vulnerable group so I often heard from many people saying, the best thing you can do is to stay healthy. I thought it is true. When young is the least period to be ill and if you monitor your health and stay healthy, it will also benefit when you get older and prevent so many diseases.

 

I started to think about some of the features that could go in the app. The main feature should be health monitoring, as it is an app to prevent being ill when not ill. But still, I thought the possibility to book an appointment for a doctor and get a prescription is important because it was a factor that caused a lot of pain for me. However, because I am aiming to target the users that aren’t often ill so I thought I needed more functions to it.

I found Thriva that provides a service to allow people to have self-test their health. They have a few kits to test your Vitamin, Cholesterol, Liver function etc. I thought it might be a good idea to put a service that users can have regular appointment with a doctor to more professionally consult their health alongside with daily health monitoring. It’s like, for example, you have your result from the kit and have a regular meeting with the doctor. Doctor will recommend things to improve your current state by suggesting possible activities everyday that you can track from the app. So the appointments could have two sections, regular appointment and emergency appointment.

 

Persona. It was somewhat fun to just imagining the possible user from the user group and freely imagine what she is like. But, of course, I did reflect myself into it because I am also included in the user group. With the character, I tried to have it as soft as possible.

User journey was also about imagining but this time, imagining the situation. Imagining the journey she is going through. User journey is about coming up with pain points of the users and find out possible opportunities. This time as well, I did also reflect my own experience into it but at the same time, trying to consider other factors.

Coming up with avatars

Design research was needed before I start to sketch anything. I looked up for healthcare related projects in Behance. Like mentioned before, many colour schemes were cool tones which I wanted to change. Also, I’ve noticed there were many projects that used neumorphism style, which seemed like a trend these days, however, it as well felt little bit cold and robotic. It looked like it would look good with projects that need a lot of buttons like smarthome. But I thought for my project, it didn’t suit. I thought for my intention, which is to relax people from thinking GP and healthcare as something scary, having illustrations is the best thing. And there were many healthcare projects that used one colour but I wanted to make it more colourful making it looking a bit more lively.

I roughly drew out the visual images that I had on my mind. Looking at it, I thought creating avatars that I will use is the priority here so that I can match other elements according to it.

I liked how the character of the persona looks very soft and warm, I decided to use that character as one of them. As this is an app that I imagine to be published in UK, my users are not only Asian. So I thought I needed to create each races, white, asian, brown and black. And to make the illustration more fun and to give more options for users to choose their own avatar, I also came up with 4 hair colours and 4 t-shirt colours.

 

While creating these avatars, I again thought it is definitely different to design in UK compared to Korea (though I’ve never designed in Korea). If I was studying design in Korea or creating this app in Korea, I would have created only asian avatars with brown, black hair because that’s majority in Korea. But in UK, there are so many races living together and it would be very controversial if I put one certain race for avatar selection. I was glad that I’m not that ignorant to not consider that.

My avatars are set, it’s time for me to create some variations. As my wireframe shows, this app suggests you what to improve on when you open up the app. I thought having more impact on the message might help users to do what is suggested. Because there are already so many apps that suggest you what to do but often it falls into a trap of which users don’t follow the suggestions or don’t make it as a habit and eventually just give up. We normally think our health will last forever, however, everything will pile up and eventually it will make or health when you get older be bad. So by showing the avatar, healthy looking avatar, turning into a suffering face and giving a message that you will end up having certain disease if you don’t improve it.

 

It wasn’t easy to come up with facial expressions of avatars for each, especially those ones that don’t have direct facial expressions for them. So I came up with three direct ones first. Activity, water and sleep cycle. Activity, obviously, could make people get fat if there’s not much of activity during the day. Water, as there is an adjective for it when you don’t have enough water, thirsty, it seemed to be direct as well. And sleep cycle, I thought of how people often say they have darker dark circles under their eyes when they are tired or when they didn’t get a good sleep. I picked random avatars and created each avatars and it looked quite cute.

More UI designing

Most of the illustrations that I need for wireframing is done. Of course I will be needing more illustrations and icons later but for now, when I am structuring, having these main avatars would be more than enough since they will be the main visuals. For the tool, I used Adobe XD. I have used XD before but that was quite a few years ago, when it just came out. I’ve also used Sketch but I’ve heard for prototyping, Sketch isn’t the best tool to use and other platforms were recommended, however, I thought it might be a bit too much if I tried to learn a completely new platform while I’m just going through this UX/UI process.

I needed to come up with colours. I automatically excluded blue and purple. I just wanted it to be very soft and warm. While I was looking for some colour inspirations, green came into my mind because it’s known as a colour that calms you down. And it is also a colour to represent that it is safe. As thinking of green, I thought of the screen which the avatar “warns” the user to do something. Safety and warning reminded me of traffic light. Red, yellow and green. I thought it would be nice to use these colours because these could work really well when describing the level of symptoms. I began to look for red, yellow and green that are warm toned. And I decided to used light beige as well.

I needed icons for onboarding page to choose things to track on and for log page. I tried having it as illustrations as well. As individuals, it looked cute, however, as a whole, I thought it slightly looked messy and it was disturbing to focus on one thing as there are so many things. So instead, I refined it to much simpler forms which one colour. As there are more spaces and less colours, I thought it looked better.

Iteration

Most of the UI was finished, however, I thought it wasn’t enough. It felt like it’s still not strong enough. As I initially intended, I tried to think of a way to put more AI element into the app. While I was using other AI generated apps, I thought there are many chats involved. So I thought, how about having an AI bot that assists the user with healthcare? I already know there are apps like Ada or Babylon that has AI chats but I always thought it was very limited. I am assuming it because they need to be very careful on what they advise and if AI makes mistake and give wrong advice, it will be controversial. But luckily(?) I’m not creating an app that will actually work and be on AppStore so I thought it will be still nice to put the service, imagining more developed future.

Prototyping

Now the interesting part. Prototyping. I need to make every pages for the interaction. It’s about small little detail to put in.

(Prototyping for AI interaction and walkthrough interaction ended up being this long.)

Ideation

Whilst going through this corona period, I started to think that after this crisis, more things will be digitalised even faster. Though digitalisation and AI already have been a trend, more of these will be coming up. Considering the time we are living in and with these trends, I thought it is a perfect chance to create an app for this. It was possible to find many news or posts of people who were scared if their symptoms are coming from corona and even if it is a symptom that isn’t related to corona, they are scared to visit GP. Nonetheless, due to the shortage of workers and facilities, it is not recommended to visit GP unless it’s very serious and not related to corona symptoms and GPs are too busy that can’t pick up their phones. Many foreigners went back to their countries because of this.

 

In this situation, I thought of a healthcare app for young adults who are relatively healthy and want to stay healthy. It is an app to monitor their health such as activities, weight, sleep cycle etc by themselves daily and have 3-6 monthly check-up with online GP by having a self-check kit so they can improve their health while staying healthy as usual. Also, when they happen to be ill, usually it’s not something serious, so they can just quickly see their online GP and have the medications delivered. This way, more people will be able to stay healthy and save their time and there will be more spaces available for patients who actually need help and care.

 

Before actually research or go into the project itself, I felt like I needed to study more about UX/UI. After Affo, my interest in UX/UI went up and after looking up some information of the job, I’ve realised that I need another portfolio. That I can’t really apply for any internship with graphic design portfolio with no proper UX/UI elements. So I looked up for some quick course explaining basic methodologies of UX to briefly understand what I need to create.

Research / UX

Firstly, like always, I started with basic research of my users and healthcare apps. When I searched for existing healthcare apps and general images of healthcare, most of them used green, blue and purple but cool-toned colours. Maybe those colours were used to provoke logical and reliable images, however, at the same time, I felt like it also brings the image of coldness. From our childhood to until we die, hospital is not a place they want to be at and they are scared to be ill. Because I aim to target relatively healthy age groups, 18-34 and maximum 40 and because this app’s purpose is not to get treatment, instead it is to prevent being ill by monitoring everyday health, I thought I could change that image.

 

I thought it might worth to come up with this app. There are many online-GP apps and many health tracking apps but there is not many GP + health tracking app for prevention purposes. Most of GP services happen after people get ill and same with Health app from Iphone, which it sends the detail of the patient’s health records and daily tracks to the hospital but only after getting ill. While I’m in this crisis, because I’m young, I’m not in vulnerable group so I often heard from many people saying, the best thing you can do is to stay healthy. I thought it is true. When young is the least period to be ill and if you monitor your health and stay healthy, it will also benefit when you get older and prevent so many diseases.

 

I started to think about some of the features that could go in the app. The main feature should be health monitoring, as it is an app to prevent being ill when not ill. But still, I thought the possibility to book an appointment for a doctor and get a prescription is important because it was a factor that caused a lot of pain for me. However, because I am aiming to target the users that aren’t often ill so I thought I needed more functions to it.

I found Thriva that provides a service to allow people to have self-test their health. They have a few kits to test your Vitamin, Cholesterol, Liver function etc. I thought it might be a good idea to put a service that users can have regular appointment with a doctor to more professionally consult their health alongside with daily health monitoring. It’s like, for example, you have your result from the kit and have a regular meeting with the doctor. Doctor will recommend things to improve your current state by suggesting possible activities everyday that you can track from the app. So the appointments could have two sections, regular appointment and emergency appointment.

 

Persona. It was somewhat fun to just imagining the possible user from the user group and freely imagine what she is like. But, of course, I did reflect myself into it because I am also included in the user group. With the character, I tried to have it as soft as possible.

User journey was also about imagining but this time, imagining the situation. Imagining the journey she is going through. User journey is about coming up with pain points of the users and find out possible opportunities. This time as well, I did also reflect my own experience into it but at the same time, trying to consider other factors.

Coming up with avatars

Design research was needed before I start to sketch anything. I looked up for healthcare related projects in Behance. Like mentioned before, many colour schemes were cool tones which I wanted to change. Also, I’ve noticed there were many projects that used neumorphism style, which seemed like a trend these days, however, it as well felt little bit cold and robotic. It looked like it would look good with projects that need a lot of buttons like smarthome. But I thought for my project, it didn’t suit. I thought for my intention, which is to relax people from thinking GP and healthcare as something scary, having illustrations is the best thing. And there were many healthcare projects that used one colour but I wanted to make it more colourful making it looking a bit more lively.

I roughly drew out the visual images that I had on my mind. Looking at it, I thought creating avatars that I will use is the priority here so that I can match other elements according to it.

I liked how the character of the persona looks very soft and warm, I decided to use that character as one of them. As this is an app that I imagine to be published in UK, my users are not only Asian. So I thought I needed to create each races, white, asian, brown and black. And to make the illustration more fun and to give more options for users to choose their own avatar, I also came up with 4 hair colours and 4 t-shirt colours.

 

While creating these avatars, I again thought it is definitely different to design in UK compared to Korea (though I’ve never designed in Korea). If I was studying design in Korea or creating this app in Korea, I would have created only asian avatars with brown, black hair because that’s majority in Korea. But in UK, there are so many races living together and it would be very controversial if I put one certain race for avatar selection. I was glad that I’m not that ignorant to not consider that.

My avatars are set, it’s time for me to create some variations. As my wireframe shows, this app suggests you what to improve on when you open up the app. I thought having more impact on the message might help users to do what is suggested. Because there are already so many apps that suggest you what to do but often it falls into a trap of which users don’t follow the suggestions or don’t make it as a habit and eventually just give up. We normally think our health will last forever, however, everything will pile up and eventually it will make or health when you get older be bad. So by showing the avatar, healthy looking avatar, turning into a suffering face and giving a message that you will end up having certain disease if you don’t improve it.

 

It wasn’t easy to come up with facial expressions of avatars for each, especially those ones that don’t have direct facial expressions for them. So I came up with three direct ones first. Activity, water and sleep cycle. Activity, obviously, could make people get fat if there’s not much of activity during the day. Water, as there is an adjective for it when you don’t have enough water, thirsty, it seemed to be direct as well. And sleep cycle, I thought of how people often say they have darker dark circles under their eyes when they are tired or when they didn’t get a good sleep. I picked random avatars and created each avatars and it looked quite cute.

More UI designing

Most of the illustrations that I need for wireframing is done. Of course I will be needing more illustrations and icons later but for now, when I am structuring, having these main avatars would be more than enough since they will be the main visuals. For the tool, I used Adobe XD. I have used XD before but that was quite a few years ago, when it just came out. I’ve also used Sketch but I’ve heard for prototyping, Sketch isn’t the best tool to use and other platforms were recommended, however, I thought it might be a bit too much if I tried to learn a completely new platform while I’m just going through this UX/UI process.

I needed to come up with colours. I automatically excluded blue and purple. I just wanted it to be very soft and warm. While I was looking for some colour inspirations, green came into my mind because it’s known as a colour that calms you down. And it is also a colour to represent that it is safe. As thinking of green, I thought of the screen which the avatar “warns” the user to do something. Safety and warning reminded me of traffic light. Red, yellow and green. I thought it would be nice to use these colours because these could work really well when describing the level of symptoms. I began to look for red, yellow and green that are warm toned. And I decided to used light beige as well.

I needed icons for onboarding page to choose things to track on and for log page. I tried having it as illustrations as well. As individuals, it looked cute, however, as a whole, I thought it slightly looked messy and it was disturbing to focus on one thing as there are so many things. So instead, I refined it to much simpler forms which one colour. As there are more spaces and less colours, I thought it looked better.

Iteration

Most of the UI was finished, however, I thought it wasn’t enough. It felt like it’s still not strong enough. As I initially intended, I tried to think of a way to put more AI element into the app. While I was using other AI generated apps, I thought there are many chats involved. So I thought, how about having an AI bot that assists the user with healthcare? I already know there are apps like Ada or Babylon that has AI chats but I always thought it was very limited. I am assuming it because they need to be very careful on what they advise and if AI makes mistake and give wrong advice, it will be controversial. But luckily(?) I’m not creating an app that will actually work and be on AppStore so I thought it will be still nice to put the service, imagining more developed future.

Prototyping

Now the interesting part. Prototyping. I need to make every pages for the interaction. It’s about small little detail to put in.

(Prototyping for AI interaction and walkthrough interaction ended up being this long.)

Ideation

Whilst going through this corona period, I started to think that after this crisis, more things will be digitalised even faster. Though digitalisation and AI already have been a trend, more of these will be coming up. Considering the time we are living in and with these trends, I thought it is a perfect chance to create an app for this. It was possible to find many news or posts of people who were scared if their symptoms are coming from corona and even if it is a symptom that isn’t related to corona, they are scared to visit GP. Nonetheless, due to the shortage of workers and facilities, it is not recommended to visit GP unless it’s very serious and not related to corona symptoms and GPs are too busy that can’t pick up their phones. Many foreigners went back to their countries because of this.

 

In this situation, I thought of a healthcare app for young adults who are relatively healthy and want to stay healthy. It is an app to monitor their health such as activities, weight, sleep cycle etc by themselves daily and have 3-6 monthly check-up with online GP by having a self-check kit so they can improve their health while staying healthy as usual. Also, when they happen to be ill, usually it’s not something serious, so they can just quickly see their online GP and have the medications delivered. This way, more people will be able to stay healthy and save their time and there will be more spaces available for patients who actually need help and care.

 

Before actually research or go into the project itself, I felt like I needed to study more about UX/UI. After Affo, my interest in UX/UI went up and after looking up some information of the job, I’ve realised that I need another portfolio. That I can’t really apply for any internship with graphic design portfolio with no proper UX/UI elements. So I looked up for some quick course explaining basic methodologies of UX to briefly understand what I need to create.

Research / UX

Firstly, like always, I started with basic research of my users and healthcare apps. When I searched for existing healthcare apps and general images of healthcare, most of them used green, blue and purple but cool-toned colours. Maybe those colours were used to provoke logical and reliable images, however, at the same time, I felt like it also brings the image of coldness. From our childhood to until we die, hospital is not a place they want to be at and they are scared to be ill. Because I aim to target relatively healthy age groups, 18-34 and maximum 40 and because this app’s purpose is not to get treatment, instead it is to prevent being ill by monitoring everyday health, I thought I could change that image.

 

I thought it might worth to come up with this app. There are many online-GP apps and many health tracking apps but there is not many GP + health tracking app for prevention purposes. Most of GP services happen after people get ill and same with Health app from Iphone, which it sends the detail of the patient’s health records and daily tracks to the hospital but only after getting ill. While I’m in this crisis, because I’m young, I’m not in vulnerable group so I often heard from many people saying, the best thing you can do is to stay healthy. I thought it is true. When young is the least period to be ill and if you monitor your health and stay healthy, it will also benefit when you get older and prevent so many diseases.

 

I started to think about some of the features that could go in the app. The main feature should be health monitoring, as it is an app to prevent being ill when not ill. But still, I thought the possibility to book an appointment for a doctor and get a prescription is important because it was a factor that caused a lot of pain for me. However, because I am aiming to target the users that aren’t often ill so I thought I needed more functions to it.

I found Thriva that provides a service to allow people to have self-test their health. They have a few kits to test your Vitamin, Cholesterol, Liver function etc. I thought it might be a good idea to put a service that users can have regular appointment with a doctor to more professionally consult their health alongside with daily health monitoring. It’s like, for example, you have your result from the kit and have a regular meeting with the doctor. Doctor will recommend things to improve your current state by suggesting possible activities everyday that you can track from the app. So the appointments could have two sections, regular appointment and emergency appointment.

 

Persona. It was somewhat fun to just imagining the possible user from the user group and freely imagine what she is like. But, of course, I did reflect myself into it because I am also included in the user group. With the character, I tried to have it as soft as possible.

User journey was also about imagining but this time, imagining the situation. Imagining the journey she is going through. User journey is about coming up with pain points of the users and find out possible opportunities. This time as well, I did also reflect my own experience into it but at the same time, trying to consider other factors.

Coming up with avatars

Design research was needed before I start to sketch anything. I looked up for healthcare related projects in Behance. Like mentioned before, many colour schemes were cool tones which I wanted to change. Also, I’ve noticed there were many projects that used neumorphism style, which seemed like a trend these days, however, it as well felt little bit cold and robotic. It looked like it would look good with projects that need a lot of buttons like smarthome. But I thought for my project, it didn’t suit. I thought for my intention, which is to relax people from thinking GP and healthcare as something scary, having illustrations is the best thing. And there were many healthcare projects that used one colour but I wanted to make it more colourful making it looking a bit more lively.

I roughly drew out the visual images that I had on my mind. Looking at it, I thought creating avatars that I will use is the priority here so that I can match other elements according to it.

I liked how the character of the persona looks very soft and warm, I decided to use that character as one of them. As this is an app that I imagine to be published in UK, my users are not only Asian. So I thought I needed to create each races, white, asian, brown and black. And to make the illustration more fun and to give more options for users to choose their own avatar, I also came up with 4 hair colours and 4 t-shirt colours.

 

While creating these avatars, I again thought it is definitely different to design in UK compared to Korea (though I’ve never designed in Korea). If I was studying design in Korea or creating this app in Korea, I would have created only asian avatars with brown, black hair because that’s majority in Korea. But in UK, there are so many races living together and it would be very controversial if I put one certain race for avatar selection. I was glad that I’m not that ignorant to not consider that.

My avatars are set, it’s time for me to create some variations. As my wireframe shows, this app suggests you what to improve on when you open up the app. I thought having more impact on the message might help users to do what is suggested. Because there are already so many apps that suggest you what to do but often it falls into a trap of which users don’t follow the suggestions or don’t make it as a habit and eventually just give up. We normally think our health will last forever, however, everything will pile up and eventually it will make or health when you get older be bad. So by showing the avatar, healthy looking avatar, turning into a suffering face and giving a message that you will end up having certain disease if you don’t improve it.

 

It wasn’t easy to come up with facial expressions of avatars for each, especially those ones that don’t have direct facial expressions for them. So I came up with three direct ones first. Activity, water and sleep cycle. Activity, obviously, could make people get fat if there’s not much of activity during the day. Water, as there is an adjective for it when you don’t have enough water, thirsty, it seemed to be direct as well. And sleep cycle, I thought of how people often say they have darker dark circles under their eyes when they are tired or when they didn’t get a good sleep. I picked random avatars and created each avatars and it looked quite cute.

More UI designing

Most of the illustrations that I need for wireframing is done. Of course I will be needing more illustrations and icons later but for now, when I am structuring, having these main avatars would be more than enough since they will be the main visuals. For the tool, I used Adobe XD. I have used XD before but that was quite a few years ago, when it just came out. I’ve also used Sketch but I’ve heard for prototyping, Sketch isn’t the best tool to use and other platforms were recommended, however, I thought it might be a bit too much if I tried to learn a completely new platform while I’m just going through this UX/UI process.

I needed to come up with colours. I automatically excluded blue and purple. I just wanted it to be very soft and warm. While I was looking for some colour inspirations, green came into my mind because it’s known as a colour that calms you down. And it is also a colour to represent that it is safe. As thinking of green, I thought of the screen which the avatar “warns” the user to do something. Safety and warning reminded me of traffic light. Red, yellow and green. I thought it would be nice to use these colours because these could work really well when describing the level of symptoms. I began to look for red, yellow and green that are warm toned. And I decided to used light beige as well.

I needed icons for onboarding page to choose things to track on and for log page. I tried having it as illustrations as well. As individuals, it looked cute, however, as a whole, I thought it slightly looked messy and it was disturbing to focus on one thing as there are so many things. So instead, I refined it to much simpler forms which one colour. As there are more spaces and less colours, I thought it looked better.

Iteration

Most of the UI was finished, however, I thought it wasn’t enough. It felt like it’s still not strong enough. As I initially intended, I tried to think of a way to put more AI element into the app. While I was using other AI generated apps, I thought there are many chats involved. So I thought, how about having an AI bot that assists the user with healthcare? I already know there are apps like Ada or Babylon that has AI chats but I always thought it was very limited. I am assuming it because they need to be very careful on what they advise and if AI makes mistake and give wrong advice, it will be controversial. But luckily(?) I’m not creating an app that will actually work and be on AppStore so I thought it will be still nice to put the service, imagining more developed future.

Prototyping

Now the interesting part. Prototyping. I need to make every pages for the interaction. It’s about small little detail to put in.

(Prototyping for AI interaction and walkthrough interaction ended up being this long.)

Ideation

Whilst going through this corona period, I started to think that after this crisis, more things will be digitalised even faster. Though digitalisation and AI already have been a trend, more of these will be coming up. Considering the time we are living in and with these trends, I thought it is a perfect chance to create an app for this. It was possible to find many news or posts of people who were scared if their symptoms are coming from corona and even if it is a symptom that isn’t related to corona, they are scared to visit GP. Nonetheless, due to the shortage of workers and facilities, it is not recommended to visit GP unless it’s very serious and not related to corona symptoms and GPs are too busy that can’t pick up their phones. Many foreigners went back to their countries because of this.

 

In this situation, I thought of a healthcare app for young adults who are relatively healthy and want to stay healthy. It is an app to monitor their health such as activities, weight, sleep cycle etc by themselves daily and have 3-6 monthly check-up with online GP by having a self-check kit so they can improve their health while staying healthy as usual. Also, when they happen to be ill, usually it’s not something serious, so they can just quickly see their online GP and have the medications delivered. This way, more people will be able to stay healthy and save their time and there will be more spaces available for patients who actually need help and care.

 

Before actually research or go into the project itself, I felt like I needed to study more about UX/UI. After Affo, my interest in UX/UI went up and after looking up some information of the job, I’ve realised that I need another portfolio. That I can’t really apply for any internship with graphic design portfolio with no proper UX/UI elements. So I looked up for some quick course explaining basic methodologies of UX to briefly understand what I need to create.

Research / UX

Firstly, like always, I started with basic research of my users and healthcare apps. When I searched for existing healthcare apps and general images of healthcare, most of them used green, blue and purple but cool-toned colours. Maybe those colours were used to provoke logical and reliable images, however, at the same time, I felt like it also brings the image of coldness. From our childhood to until we die, hospital is not a place they want to be at and they are scared to be ill. Because I aim to target relatively healthy age groups, 18-34 and maximum 40 and because this app’s purpose is not to get treatment, instead it is to prevent being ill by monitoring everyday health, I thought I could change that image.

 

I thought it might worth to come up with this app. There are many online-GP apps and many health tracking apps but there is not many GP + health tracking app for prevention purposes. Most of GP services happen after people get ill and same with Health app from Iphone, which it sends the detail of the patient’s health records and daily tracks to the hospital but only after getting ill. While I’m in this crisis, because I’m young, I’m not in vulnerable group so I often heard from many people saying, the best thing you can do is to stay healthy. I thought it is true. When young is the least period to be ill and if you monitor your health and stay healthy, it will also benefit when you get older and prevent so many diseases.

 

I started to think about some of the features that could go in the app. The main feature should be health monitoring, as it is an app to prevent being ill when not ill. But still, I thought the possibility to book an appointment for a doctor and get a prescription is important because it was a factor that caused a lot of pain for me. However, because I am aiming to target the users that aren’t often ill so I thought I needed more functions to it.

I found Thriva that provides a service to allow people to have self-test their health. They have a few kits to test your Vitamin, Cholesterol, Liver function etc. I thought it might be a good idea to put a service that users can have regular appointment with a doctor to more professionally consult their health alongside with daily health monitoring. It’s like, for example, you have your result from the kit and have a regular meeting with the doctor. Doctor will recommend things to improve your current state by suggesting possible activities everyday that you can track from the app. So the appointments could have two sections, regular appointment and emergency appointment.

 

Persona. It was somewhat fun to just imagining the possible user from the user group and freely imagine what she is like. But, of course, I did reflect myself into it because I am also included in the user group. With the character, I tried to have it as soft as possible.

User journey was also about imagining but this time, imagining the situation. Imagining the journey she is going through. User journey is about coming up with pain points of the users and find out possible opportunities. This time as well, I did also reflect my own experience into it but at the same time, trying to consider other factors.

Coming up with avatars

Design research was needed before I start to sketch anything. I looked up for healthcare related projects in Behance. Like mentioned before, many colour schemes were cool tones which I wanted to change. Also, I’ve noticed there were many projects that used neumorphism style, which seemed like a trend these days, however, it as well felt little bit cold and robotic. It looked like it would look good with projects that need a lot of buttons like smarthome. But I thought for my project, it didn’t suit. I thought for my intention, which is to relax people from thinking GP and healthcare as something scary, having illustrations is the best thing. And there were many healthcare projects that used one colour but I wanted to make it more colourful making it looking a bit more lively.

I roughly drew out the visual images that I had on my mind. Looking at it, I thought creating avatars that I will use is the priority here so that I can match other elements according to it.

I liked how the character of the persona looks very soft and warm, I decided to use that character as one of them. As this is an app that I imagine to be published in UK, my users are not only Asian. So I thought I needed to create each races, white, asian, brown and black. And to make the illustration more fun and to give more options for users to choose their own avatar, I also came up with 4 hair colours and 4 t-shirt colours.

 

While creating these avatars, I again thought it is definitely different to design in UK compared to Korea (though I’ve never designed in Korea). If I was studying design in Korea or creating this app in Korea, I would have created only asian avatars with brown, black hair because that’s majority in Korea. But in UK, there are so many races living together and it would be very controversial if I put one certain race for avatar selection. I was glad that I’m not that ignorant to not consider that.

My avatars are set, it’s time for me to create some variations. As my wireframe shows, this app suggests you what to improve on when you open up the app. I thought having more impact on the message might help users to do what is suggested. Because there are already so many apps that suggest you what to do but often it falls into a trap of which users don’t follow the suggestions or don’t make it as a habit and eventually just give up. We normally think our health will last forever, however, everything will pile up and eventually it will make or health when you get older be bad. So by showing the avatar, healthy looking avatar, turning into a suffering face and giving a message that you will end up having certain disease if you don’t improve it.

 

It wasn’t easy to come up with facial expressions of avatars for each, especially those ones that don’t have direct facial expressions for them. So I came up with three direct ones first. Activity, water and sleep cycle. Activity, obviously, could make people get fat if there’s not much of activity during the day. Water, as there is an adjective for it when you don’t have enough water, thirsty, it seemed to be direct as well. And sleep cycle, I thought of how people often say they have darker dark circles under their eyes when they are tired or when they didn’t get a good sleep. I picked random avatars and created each avatars and it looked quite cute.

More UI designing

Most of the illustrations that I need for wireframing is done. Of course I will be needing more illustrations and icons later but for now, when I am structuring, having these main avatars would be more than enough since they will be the main visuals. For the tool, I used Adobe XD. I have used XD before but that was quite a few years ago, when it just came out. I’ve also used Sketch but I’ve heard for prototyping, Sketch isn’t the best tool to use and other platforms were recommended, however, I thought it might be a bit too much if I tried to learn a completely new platform while I’m just going through this UX/UI process.

I needed to come up with colours. I automatically excluded blue and purple. I just wanted it to be very soft and warm. While I was looking for some colour inspirations, green came into my mind because it’s known as a colour that calms you down. And it is also a colour to represent that it is safe. As thinking of green, I thought of the screen which the avatar “warns” the user to do something. Safety and warning reminded me of traffic light. Red, yellow and green. I thought it would be nice to use these colours because these could work really well when describing the level of symptoms. I began to look for red, yellow and green that are warm toned. And I decided to used light beige as well.

I needed icons for onboarding page to choose things to track on and for log page. I tried having it as illustrations as well. As individuals, it looked cute, however, as a whole, I thought it slightly looked messy and it was disturbing to focus on one thing as there are so many things. So instead, I refined it to much simpler forms which one colour. As there are more spaces and less colours, I thought it looked better.

Iteration

Most of the UI was finished, however, I thought it wasn’t enough. It felt like it’s still not strong enough. As I initially intended, I tried to think of a way to put more AI element into the app. While I was using other AI generated apps, I thought there are many chats involved. So I thought, how about having an AI bot that assists the user with healthcare? I already know there are apps like Ada or Babylon that has AI chats but I always thought it was very limited. I am assuming it because they need to be very careful on what they advise and if AI makes mistake and give wrong advice, it will be controversial. But luckily(?) I’m not creating an app that will actually work and be on AppStore so I thought it will be still nice to put the service, imagining more developed future.

Prototyping

Now the interesting part. Prototyping. I need to make every pages for the interaction. It’s about small little detail to put in.

(Prototyping for AI interaction and walkthrough interaction ended up being this long.)

More blogs

Process   ·   18 min read

Essay   ·   21 min read

More blogs

Process   ·   18 min read

Essay   ·   21 min read

More blogs

Process   ·   18 min read

Essay   ·   21 min read

More blogs

Process   ·   18 min read

Essay   ·   21 min read

Made with love by Jimin Kim  |  Copyright 2020

Made with love by Jimin Kim  |  Copyright 2020