gut check | portfolio

my role: ux design & ux research

As a designer with a creative background, I wanted to develop a platform with not only an appealing interface, but also with a beneficial purpose. Therefore, I decided to reach out to my surgeon cousin, Dr. Leyla Khalilova, to get more insight on what is missing in her proctology field. After a long conversation, we both decided to collaborate on an algorithm to help people find the right doctor to contact based on their symptoms. In addition, the app will keep a record of the symptoms in order to minimize the time spent on a doctor consultation.

course & time:

user experience design I

at the University of Colorado Boulder

mentor - Kevin Cook

spring 2021

tools:

adobe illustrator

adobe after effects

media encoder

figma

procreate

DOCTOR RESOURCES

full path of the prototype

PROFILE

full path of the prototype

AN ALGORYTHM TO LOCATE THE DIGESTIVE ISSUES AND A GUIDE TO FIND THE RIGHT TYPE OF DOCTOR

background

In this platform, people with immediate or accumulated

digestive symptoms will be able to help both themselves and doctors to locate the problem and guide with their right type of doctor in that field.

From research, I discovered that proctologists screen their patients with specific sets of intimate questions. This helps to locate the few variations of the medical issues as well as the locations of these issues. This type of screening also lets the users choose between 4 different and common kinds of doctors that specialize in the digestive system area. This would allow people to comfortably answer questions due to an intimate nature of the subject and save some time for doctors before the appointment.

goals

Construct a practical and accurate algorithm in finding guidance for both patients and doctors.

Create a comfortability and fun for first time patients in a fun interactive quiz type system.

Build communities within the platform and record all the symptoms just like a medical diary.

sample interview questions for collecting data

How is your experience with finding a doctor?

Are you comfortable with sharing information with a doctor?

How long does it take you to seek help?

How do you find out about your condition?

methodology

I mostly collaborated with my cousin, who is a surgeon in the proctology field, to come up with a platform that would reflect the real life experiences of patients and doctors. Furthermore, I also interviewed friends and family who went through digestive conditions or abnormal experiences to collect as much data as possible. These interviews ranged from zoom meetings, phone calls and in person dinners throughout the project.

participant screening

Ages anywhere from 18 and up, since people can set up medical consultations/appointments after that age and it is an intimate topic.

Any background with digestive history would be sufficient. Users must have some sort of medical scenario/experience before,.

PERSONAL NOTES FORM INTERVIEWS/RESEARCH

Above are some scans of my raw notes during my research, including:

Sample questions for people I interviewed
Interviews with people who had experience with diverse intestinal/abdominal problems
Interview and brainstorming with my proctologist surgeon cousin, Dr. Khalilova
Explanations of the causes and symptoms of abdominal/digestive complications
Creation of 2 hypothetical personas, to give examples of the location and resource for the experienced problems
Golden Path for users of gut check

“People are very insecure to share what is going on with their bodies, especially butts. This leads them to wait till their condition has become more serious and hard to deal with.”

- Dr. Khalilova

RESEARCH INSIGHTS

digestive system is a whole other planet...

There are a lot of causes and symptoms that occur in the digestive system for people around the world, no matter their location or genetics. This requires more specialized resources for people in need.

intimacy of the subject is real

A lot of people feel intimidated to share about what is going on with their digestive system. It is almost like women having periods, kinda challenging to share with people. Most people keep it to themselves until there is a serious problem.

doctors usually ask the same questions

When anyone gets a proctology related consultation, doctors usually ask the same sets of questions to locate the problem area and then prepare for the next steps. These questions collect data that can be recorded daily, or as much as it happens. Some people may have trouble remembering the frequency or symptoms they've experienced which can result in wasted time during an appointment.

TURNING INSIGHTS INTO DESIGN

allow people to take a short quiz that would give them a resource

Currently, it is very common for a lot of products/companies to quiz customers to give the best customized and tailored experience at the end. This allows people to feel more connected to the product and get help that is meant for an individual taking the questionnaire.

accessibility is a heated topic currently for a good reason

Focus on accessibility for users who might want to either adjust

the interface to have a more comfortable experience or just simply have a fun recourse to make each profile unique to the user.

help people not be intimidated by sharing intimate information

Make the whole experience more friendly for each user by having appealing visuals and animations to help them get through the intimidation of the subject. Also focus on simplicity to be more legible for people from all walks of life.

AFFINITY MAP

Sample-Research-Plan-Fidan-gut-check-11.

PRIMARY USER FLOW

LOW FIDELITY WIREFRAMES | GOLDEN PATH

Wireframes below show all the sections of the questionnaire that is conducted by proctologist appointments, according to Dr. Khalilova.

lifestyle quiz pt1

intro animation

about the app pt1

about the app pt2

about the app pt3

beginning of the app

age/gender/weight

female anamnesis vitae

lifestyle quiz pt2

lifestyle quiz pt3

lifestyle quiz pt4

lifestyle quiz pt5

anamnesis morbi

2nd set of questions

symptoms pt1

symptoms pt2

transition animation

full assessment is done!

resources/app gateway

assessment animation

check in page

symptoms pt3

app home page

below are some symptoms that this persona experiences:

She has a constipation •

Deification is painful •

She has a lot of bloating •

She has a very bright red bleeding in her stool •

She was pregnant before •

She sometimes drinks alcohol •

She drinks a very low amount of water, mostly tea or coffee •

There is/are no case/cases of tumor in his family/genetics •

She is not overweight or not underweight •

She doesn't eat fruits that much •

She takes about 3000-4000 steps a day •

She is either overweight or normal weight •

She takes prescription drugs •

She has abnormal swelling around rectum/anus •

these sets of symptoms/experiences are generally linked with problems located in Colon (which is around below the stomach area)

best advisable doctor to take care of this persona would be in the Coloproctology field, according to Dr. Khalilova

PERSONA A - FEMALE in her end of 30's

PERSONA B - MALE in his 55-60's

these sets of symptoms/experiences are generally linked with problems located in Duodenum (which is around above the stomach area)

best advisable doctor to take care of this persona would be in Gastroenterology field, according to Dr. Khalilova

below are some symptoms that this persona experiences:

• He has pain in his abdomen when not hungry

• He has a severe pain in his stomach

• He has a lot of bloating

• He burps a lot

• He is constantly nauseous

• He regularly drinks alcohol and smokes cigarettes

• He drinks tea or coffee a lot

• There is/are a case/cases of tumor in his family/genetics

• He doesn't eat fruits that much

• He takes about 3000-4000 steps a day

• He is either overweight or normal weight

• If he takes aspirin cardio - might have a lot of pain - might cause bleeding

• Lactose doesn't affect that much of the diagnosis in this case

HYPOTHETICAL PERSONAS WITH DIFFERENT SYMPTOMS

Below are 2 personas that Dr. Khalilova provided from her personal experience with patients. These symptoms help her find the location of the problem area and then advice which specialist takes care of the specific issue that patient is dealing with.

ANIMATED HIGH FIDELITY WIREFRAMES

Below are some of the screens that transition to one another. These animated wireframes allow clearer representation of how user flow is set up.

initial intro animation

quiz

doctor resources

outside the app

inside the app

calendar | check in page

ACCESSIBILITY

In gut check, I also wanted to implement a robust, yet simple accessibility tool for users not only to make the whole experience more fun and personal, but also elevate the experience for people with diverse backgrounds. I decided to add this tab in an easily reachable location and paired it with language tab to give access to people on all walks of life.

The importance of the Accessibility has become a heated topic recently, for a good cause and implementing such tools in any product creates a more comfortable place, as well as brings diversity to the platform. I have also conducted interviews with my quadriplegic friend, where I delved into deeper research on how accessibility can be used to improve user experience in this recent project that I created, MANATEE

Maria is my dear friend that I met during our internship at Disney.

She was very kind and shared her thoughts and experiences as a person with motor disability and her interactions with technology in an interview. I collected keywords below from my conversation with Maria.

Further, I also collected some data from research on accessibility through various means that is also listed in my previous MANATEE project.

keywords from an interview with Maria

accessibility tab

USER TESTING & FEEDBACK

During my initial attempts on high fidelity prototyping the gut check app, I was able to show and receive feedback on the overall user experience and accessibility of the certain elements of the app. Below, I divided general feedback into constructive feedback, as well as positive feedback.

constructive criticism

I was able to collect important observations from my classmates, friends, and my mentor, Kevin. Initially, my prototype included both "find a doctor" tab and "resources" tab in one page, making people scroll a lot. Kevin advised me to separate the "find a doctor" section, to not take away the daily experience of the rest of the app. Later on, Dan Liu - a fellow classmate , reached out and gave me the idea of adding some tabs on top to eliminate the long scroll.

Below, i added the old version of the homepage with everything on a homepage, as well as some detailed criticism from Kevin on important points that i missed.

positive feedback

I was also fortunate to collect more data on how I could improve on the user experience, through this feedback form.

I was very surprised on how people were interested in a bigger scale of this specific project and were pleased with the design.

One of the participants shared a great suggestion by replying to a question: "What are some improvements that can be made to gut check?" with "I guess more options? I know that even though my "gluten problems" was actually laundry detergent problems, some symptoms to intolerance to food can be more than just digestive issues like eczema, hives, etc."

After all the received feedback, I was able to tweak the color hierarchy and used Deque University to make elements more legible and accessible.

Some specific feedback I received:

Looking at the old process design, I positioned the logo on top with no particular purpose. I was advised to revise my design decision into more practical use by eliminating the interference with confusing user experience.

I also had a lot of color contrast issues with my conservative choice of colors. The whole hierarchy between buttons and other sections of the app lacked color contrast and was more leaning to focus on graphic design, rather than interaction design.

The use of a checkmark on the "check in" button showcased more vague interpretation and kept the graphic design built, rather than connecting the major function into something more connected to the concept.

All of the colors that I used were also not checked for their legibility. Therefore, I decided to update all the colors and shades to have the fullest contrast for people with accessibility needs.

The handicapped Icon was also a design that I came up with. However, this decision would add confusion for certain people with various backgrounds. In this case, using a universally recognized and designed icons were advised to be implemented by either using the current officially recognized accessibility logo or an icon from Apple's, or Google's library.

old process design

LIVE INTERACTIVE PROTOTYPE

BRANDING, ILLUSTRATIONS, ANIMATIONS - GRAPHIC DESIGN

MAIN LOGO

For the branding of this project, I decided to utilize the first letter of gut check in a very minimal, yet very dynamic way. I recently became very interested in animation, therefore, tried to implement my current skills to create a friendly identity for users to enjoy and not get bored. The overall concept of checking any symptoms or daily check-ins allowed me to transform typography into a simplistic and a classic sign, mirroring a check-in button.

Additionally, transforming the U and the T of the word gut into a welcoming smile was also another layer of making the logo a unique and fun visual, in general.

symptom located transition

ANIMATED LOGO

loading transition

symptom assessment transition

INITIAL SKETCHES ON THE LOGO

COLOR PALETTE

#11676B

#22A0A9

#FB607F

#FF91A4

USED ICONS

#CB4F06

#F99C67

#000000

#FFFFFF

USED FONTS

SKETCHES MADE IN PROCREATE

FINAL ILLUSTRATIONS

a person who is disgusted by meat

a person who is browsing the articles

two people creating a community

a bloated & nauseated person who smokes cigarettes

a bloated person who drinks alcohol

CONCLUSION & FUTURE PLANS

With this project, I wanted to challenge myself by not only diving into a medical field, but also work on a topic that is usually sort of taboo to talk or share. As a female designer, I have come across this type of intimate subject, similar to menstrual cycles, before and wanted to bring awareness to abdominal/digestive system, this time.

gut check is a product of collaboration

between a proctologist and a ux designer

In conclusion, this algorithm prototype has been constructed and designed with a lot of direct conversations between, not only a surgeon and a designer, but also a handful of people with medical history, whether it is specifically in the proctology field or general history as well.

All the feedback received during the design/planning process have made a huge impact on making this platform as accessible and fun as possible.

surprisingly, most of the feedback from user testers have been encouraging and positive to make this concept live

From usability, concept, and all the way to design, gut check made a great impression on people with diverse backgrounds. Therefore, it is very exciting to create a product that reaches a specific audience that is also very common in any part of the world.

For the future of this app, I need to conduct a more robust research on how doctors conduct their assessments in various locations and specifically in

the proctology field, rather than collaborating with one doctor. Coming up

with a more accurate algorithm is very important and is not reflected in this

initial prototype.

Thank you so much for taking your time and reaching the end!