Case Discussion With Mockups
Case Study Introduction
This case study will demonstrate the responsiveness of the website by showing the website on different screen sizes and devices. It gives a project overview of the project by discussing what type of project it was, the team's roles and responsibilities, the duration of the project, and the problem. It describes the user persona of the customer to show we have an extensive understanding of the customer. It presents the sitemap that we created to demonstrate the clean, professional, and creative organization of the site. It discusses our design process from discovery, ideation, testing, defining, and design. It shows that we understand the user through conducting desk research, wireframing, user research, and visual design. It displays all of the components we used across the site. It introduces the different types of typography we used across the site by demonstrating fonts, sizes, and weight. It shows our expertise with color schemes, by demonstrating our choice of colors across the user interface. It shows the wireframes created by the user experience designer, using customer input and user research. It shows the final UI design demonstrating color concepts, stock photography, and graphics used across the site. It also gives samples and APIs for the code used across the site.
John needed a website for his new business. John wanted to start selling custom mats. He needed a website where customers could upload custom mat designs so John could create them. We created a custom website for John, an animated video to engage users, and wrote SEO page descriptions.
Our UX designer created wireframes for the website. Our UI Designer created a mood board, chose a color scheme, fonts, and stock images for the website. Our UI Designer also created an animated video for the homepage featuring the Picture Mat logo. Our engineering team set up payment gateways, created an admin dashboard to manage orders, used code to create an upload feature, and used code and databases to create a review section. Our content writer wrote SEO page descriptions for the website.
Our Role & Responsibilities
We created John's website in five weeks.
John needed a professional and modern website to manage orders.
Understanding The Users
About Apps, Building product’s personas, Marketing strategy, User research, User Behavior, decision making, Find problems, Flow & SOW
Allows to define and plan the information hierarchy, to process information on a site, based on the research, making prototypes & feedback
Problem’s solutions, user center design, user flow, create products that provide meaningful and relevant experiences to users
Improve the user experience through considering the effects of illustrations, photography, typography, space, layouts and color on the usability of products and on their aesthetic appeal
Let’s us introduce the fonts we used on this website.
How We Started
On the Custom Design Page, this code was able to check and display the email of the currently logged in user. This feature was relevant to let the user know they can use a different email for the content submission or continue with the displayed email. We also added a section of this code that made the submission interactive when the user clicks on the submit button. It shows a preloader gif image that lets the user be informed that their submission is in progress.
On the dashboard page, we added a code that allows the admin access to all the submissions made by the users. The copy to clipboard API would enable the admin easily copy the contents submitted by the site users.