Case Study

Montana University.png

Case Discussion With Mockups

Case Study Introduction

Group 2035.png

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. 

Montana University.png

Project Overview

The Project

Bernadette is a professor at Montana University that needed a case study website for her students. We created a website where users could take tests, report their scores to instructors, and instructors could download reports. Admins could manage a dashboard, add users, manage the instructors, and users could create profiles. 

Our engineering team designed and created the website. The engineering team wrote code, developed databases, and engineered case studies. They also created an admin dashboard, permissions, set up field validation, a user login, user registration, analytics, and charts. They also created a dashboard for students and instructors, test reports, and a scoring system. 

Our Role & Responsibilities
Project Duration

We created Bernadette's website in nine months. 

Bernadette needed a website where her students could take tests, instructors could monitor scores, and admins could manage the platform. 

The Problem
Montana University

Sitemap

Montana University.png

Design Process

Design Process.png

Understanding The Users

Desk Research

About Apps, Building product’s personas, Marketing strategy, User research, User Behavior, decision making, Find problems, Flow & SOW

Wireframing

Allows to define and plan the information hierarchy, to process information on a site, based on the research, making prototypes & feedback

User Experience

Problem’s solutions, user center design, user flow, create products that provide meaningful and relevant experiences to users

Visual Design

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

Components

Montana University.png

Typography

Let’s us introduce the fonts we used on this website. 

Typo style

Weight

Size

Proxima Nova

Regular

28

Roboto

Regular

22

Roboto

Bold

14

Roboto

Regular

14

Roboto

Bold

13

Roboto

Regular

13

Color Palette

Montana University.png

Final Design

Montana University.png

Code Description

Rectangle 1602.png

How We Started

Montana University advanced Velo by WIX code entails a medical-related quiz of identifying correct Electrocardiography(ECG). 
The code was built majorly using Arrays which is a useful method to save multiple values in our variable. The code enables the user to have two attempts if they scored 90% and less in their first attempt. We used selection tags elements as the selection elements. When it is selected, it’s value is inserted into an array and when the total number of selected tags reaches 10 then an hidden image shows up and overlays the entire case study which prevents the user from selecting more tags and scrolling them to the buttons that allows them to check their answers and continue. In addition to the inserted values from the selection tags in the array, the said array is then compared index by index with another array with correct answers and then the answers are returned. Each selected tag’s ID is also inserted into a another array which is also compared with the correct array of correct tags ID. This enables us to further change the color of the correct selected tag to green and to red if it is wrong.

Code Description

Montana.png

APIs We Used

Get Started With Destiny’s Designs