PORTFOLIO
Miroslawa Chatys UX/UI Designer
About Me
Hello,
My name is Miroslawa Chatys .I am a UX/UI Designer and product designer ,that CREATES EMPATHY with user and designs solutions to their problems.
I love to bring simplicity and ease to complex interfaces.
I have passion for creating intuitive and delightful applications products &websites.
Nothing excites me like a smart product that solve a real problems and it is got a great growth potential .
I am have to help turn your dreams& ideals into focused clean product
How I do
.png)
BRIEF
Brief -understanding your value-product your target audience required features ,deadlines .
RESEARCH
Research-Competitive analysis's research analytics, customers journey map
.png)
PROTOTYPE
Prototype-first glimpse of how the project many look like structure ,logic, texts
DESIGN
Design-Where the magic happens .final apperance of the project after your approvement it goes to development
PROFITE
Profited-this product .As a result ,get more money than you spend by collaboration with a web design
A/B TESTING
A/B Testing
Projects
Portfolio of Work
Project 1
FRESH FOOD COMMUNITY
Project 2
Case Study-Personalising the Real Estate Business
Project 3
PAWS -the mobile application
Project nr 1
FRESH FOOD COMMUNITY-mobile application
Task
Our task was to prepare a research report on an Internet community and identify products that can be.
Goals
Develop an understanding of their Behaviour and Usage Patterns.
To understand and explain online food communities. Particularly, we deep-dived into food communities in Bangalore.
To learn how the members of these communities are utilizing the platform and highlight in how many different ways they are currently using it.
To Identify Products that can be designed for the users of this community
Perform the research part of the design process to understand how people spend time in these Communities.
Understanding our competition
My team and I conducted several competitive analyses on websites such as Etsy, Vegetarian Times, Fab, and Joy us to see what did and didn't work.
Our analysis
Data result:
Portfolio of Work
Project nr 2
Paws-mobile application
Paws is a mobile application that helps pet adopters find new pets. Accelerating the entire adoption process, Paws helps those looking for new pets find their match quicker and easier.
Summary
There are thousands and thousands of dogs and cats in shelters and foster homes waiting for adoption. New adopters are typically unaware of the process it takes to get a new pet. It isn’t as simple as just your typical shopping experience. New pet owners need to go through a multiple lifestyle matching process’ that would be able to suit their desired pets needs.
Preferences such as breed, gender, age, size, disposition, and health status are all factors that an owner needs to consider. These preferences are typically done early on in the process but can change depending on the living situation. If the process of adopting a new pet is this extensive, how can we simplify its overall process?
UI/UX
Research
Ideation
Type & Timeline
Product Design Challenge
UI/UX
1 Week
Tools Used
Figma
Team
Solo Designer
Problem Overview
There are millions of dogs and cats waiting to be adopted from foster homes and shelters.
Design Challenge
How might we accelerate the adoption process for new adopters while increasing the matching of lifestyle/preferences between the adopter and pet?
Solution
An easy to use mobile application designed to help streamline the adoption process for new adopters and experienced adopters.
Paws searches for pets available for adoption based on the user profiles set preferences and current lifestyle conditions.
Research
Research - Understanding the Space
I personally have never adopted a pet before, therefore the entire process was new to me. In order to quickly familiarize me with the space of adoption, I decided to pet owners, animal shelter workers, and people that we're currently in the process.
By the end of my research interviews, I was able to interview 2 shelter staff workers, 5 pet owners, and 3 individuals currently in the process.
Findings
Applications process’ vary from animal to animal, and pet to adopter matches are not 100% guaranteed.
The current lifestyle and living condition of the adopters is an incredibly important factor in the matching process.
The entire process completely depends on lifestyle and the initial relationship between pet and owner
Adopters need to go through an extensive lifestyle background check before searching for a pet.
User Interviews
“The process is relatively simple, but the system is really old so it mostly requires you to be there in person.”
“Looking for animals is hard too because there’s not always one website where you can go to see the available animals for ALL the shelters/rescues around your area.”
“I think in an ideal world, I'd like to just fill out everything before I even head into a shelter so once they give you the approval, you're good to go searching for a pet.”
Journey Mapping & Opportunities
After my initial research, I began creating a journey map and its individual opportunities at each stage of the process. By doing so, it allows me to synthesize the adoption process into simple steps helping my overall understanding. Additionally, it helped with identifying potential opportunities that could be translated into the final product that could help users through the adoption process.
Project
Sketches & Wireframes
Initial sketches and low fidelity wireframes were focused on the flow for new users their introduction into the mobile application. These low fidelity wireframes went through a few changes when I began the high-fidelity designs which will be discussed below.
Visual Design
Visual Design
The visual design features a slightly saturated orange to emulate a warm, inviting, and friendly ethos. The black and greys act as supporting colours to the user interface.
San Francisco was chosen as the base font due to its legibility and dynamic range of uses. The dynamics allow for the hierarchy to be established with ease and does not require custom adjustments because of its native.
High Fidelity & User Flows
On-Boarding Experience
The onboarding experience walks the user through a few screens introducing the application. At this point, if a user wants to skip the step, they can do so and move straight to their search. This alleviates the hostile feeling of having to create an account. Additionally, from the sketches and low-fidelity wireframes, the on-boarding was split into 3 different screens instead of 1. This was done to create a cleaner look in the design as well as easing the user into the application.
Lifestyle Preference & Filtering
Lifestyle preferences are set during the account creation set-up. However, it can also be created or changed later on once a user has logged in. If a user were to skip through all filters and preferences, the search engine would show all available pets ready for adoption.
Portfolio of Work
Overview
As part of our final project at Ironhack UX/UI Design Course, we redesigned the Avanti Way website to offer a personalized experience for their target audience who are people wanting to become homeowners, and added a brand new Customer Dashboard feature in a two-week sprint.
My role
I was involved as a UX/UI Designer in every aspect of the process from research to analysis and design.
Teammates
Miroslawa Chatys — UX/UI Designer
Methods and Tools
Lean Survey Canvas, Quantitative Survey and Qualitative Interview, Competitive Analysis, Site Map, User Testing, Empathy Map, Affinity Diagram, User Persona, and Journey Map, User Flow, Mood board, Design System, Wireframing, Prototyping,
Figma, Maze
01. The Challenge
Avanti Way is a realtor company based in Miami that aims to modernize the real estate business by employing cutting-edge technology. Avanti Way came to our team with the realization that their website did not reflect their brand or the premise of their service.
Besides a need to improve the user experience of their website, they also wanted to adopt a more customer-oriented tone in their overall communication.
In our two-week sprint, prioritizing features and changes to maximize the desired impact while navigating technical and other limitations has been among our challenges.
02. The Process
Research
The first step in our process was to figure out what we needed to learn and who can provide us the right information. We started by interviewing our stakeholders to get a better understanding of the business, users, competitors along with where they are and where they want to be.
Next, we used Lean Survey Canvas and sent the survey to the actual customers through Avanti Way’s communication channels.
We aimed to understand:
Their motivations for buying, selling, or renting a property
Their main criteria when searching for property
Their feelings about their experience of searching for property
Their pain points during the customer journey
Their habits when searching for a property
The interview with stakeholders has helped us learn their perspectives and understand the real estate business in the US.
However, after not getting the amount of response we needed from our survey, we decided to reach out to our target group personally. We found online communities for people interested in buying or selling property in the US to send our survey to supplement our previous findings. We also gained more qualitative data through in-depth interviews with Avanti Way’s customers.
The Affinity Diagram
Once we gathered the data from our survey and qualitative interviews, we could see patterns by creating clusters in an Affinity Diagram.
User Insights from the survey and in-depth interviews
The majority of the respondents were people interested in buying property for residential purposes rather than investment.
Their decision to buy a home was linked to a milestone in their lives; starting a family, moving to a new place, or retiring.
They were searching for properties during the week, mostly before work or during the lunch break.
They did their search mostly on desktop but mobile came as a close second.
Almost everyone stated that they found the process difficult, stressful.
They struggled the most with finding relevant information along with keeping track of everything; properties they liked, communication with agents, paperwork, and expenses required.
The User Persona
We used these insights to define our user persona; Alison and Steve, a young couple who is interested in buying a property for their growing family.
While we knew that Avanti Way had more than one user persona, we decided to focus on Alison and Steve due to the data we have and other constraints regarding time, our brief to bring emotion to the website, and more.
Our persona was really helpful to understand our customers’ motivations and frustrations in their path to become homeowners. However, we wanted to dig deeper and pinpoint where they struggle the most. So, we mapped Alison and Steve’s journey from their initial decision to buy a home to get their keys.
This exercise enabled us to see clearly where we could help our persona have a better experience: the moment they start searching for information and properties until they decide on a new home.
Afterward, we formulated our problem and hypothesis statement to initiate the ideation and design process.
Problem Statement
Buying a home is a dream come true for many. However buyers often feel confused about the process and get discouraged due to the many documents, stakeholders and expenses involved.
Hypothesis Statement
We strive to create a website that allows buyers to search for properties and manage everything related to buying a home with ease. Making the experience of owning a home a breeze, as it should be.
User Testing
Before jumping to the ideation stage, we wanted to find out which parts of Avanti Way’s website worked and which could be optimized.
To do that, we first mapped the sitemap of the current website and then tested the website with three users, giving them tasks such as finding a property they would like to buy.
We used the feedback to build the new sitemap which helped us in the ideation and design stages.
Insights from User Testing included:
Improve navigation by introducing the back button and breadcrumbs.
Increase credibility through establishing coherence of different pages of the website.
Have more precise UX copy throughout the website, particularly CTAs and buttons.
Optimize filtering options according to persona.
Modernize the overall look of the website and have it address the persona.
We used this feedback in our next step; ideation and design.
Ideation Stage
We applied several methods in the ideation stage to discover a vast range of possibilities. As we gathered and discussed our ideas, it became clear that we envisioned the Avanti Way website as a personalized experience for the customers. For our initial prototype, we decided to:
Test two different options for searching properties on the website. The first direction would entail a better filtering option where the user could set their criteria. The latter would be a personalized and casual questionnaire that emphasizes the brand’s personal and emotional tone to communicate.
Include a customer dashboard that would allow the customer to manage everything from one place and share the dashboard with their agents for seamless and transparent communication between them.
Add a blog section to the website for customers to find the information they needed. This works both ways since it builds rapport and trust with customers and helps Avanti Way reach more customers through SEO.
Mid-fidelity Prototypes and User Testing
Once we had a clear vision for what we should build, we created a user flow to guide our mid-fi prototypes.
We then designed the mid-fi prototypes for both directions and we tested them with users on Maze.
The Maze test showed that both directions were a success with users and that there wasn’t a clear preference for either direction. Therefore, after noting user feedback for both directions, we felt confident in presenting both to our client to have the final say.
For Avanti Way, it was important to be best-in-class and having a more customer-oriented approach, so they decided on the personalized questionnaire direction.
Branding and the Design System
The first step in designing the high-fi prototype was to update Avanti Way’s branding. We knew that the company didn’t want to make a drastic change. So, we kept the key elements such as colors and typography almost intact by only playing with the shades while introducing an additional typeface.
We had more freedom when it came to the image style, forms, and overall layout. We aimed to highlight Avanti Way’s brand’s personality while keeping in mind how buying a new home can be an emotional experience.
Following the guide we created for Avanti Way’s new branding, we built our design system to ensure a coherent and flexible implementation.
03. The Solution
The high-fidelity prototype
In our final prototype, we made sure to implement in our high-fi prototype the feedback we got from both the users and stakeholders:
We made the questionnaire shorter and added the opportunity to skip the steps to enable the users to complete their profiles later.
We also included the property search menu on the top navigation bar for users that would prefer searching by using filters.
We added breadcrumbs, simplified and clarified CTAs, and made navigation between pages easier.
We simplified the dashboard by taking away the collaboration with agents feature following our discovery that agents’ hectic schedules would make it hard to implement it.
THANK YOU FOR WATCHING
"I haven't failed. I've just found 10,000 ways that won't work"
Thomas Edison
