My Framer Site

Back

SK Construction

Mobile Application

The Construction management app is designed with a minimalist and user-friendly interface to streamline project coordination and task assignment in construction projects. The app is specifically developed to support teams working on construction sites, enabling efficient collaboration between team members. It facilitates real-time task management, allowing users to assign tasks to each other based on their respective roles and areas of expertise.

Construction teams lack a streamlined platform for real-time task assignment, leading to communication delays, unclear responsibilities, and missed deadlines.

Inefficient Task Assignment

Difficulty in tracking task progress and milestones hampers teams ability to identify bottlenecks and make timely decisions, affecting overall project outcomes.

Inadequate Project Tracking

Business Requirement

Challenges

Without a centralized, user-friendly system, teams struggle to manage tasks and adapt to changing conditions, resulting in delays and misalignment in project.

Lack of Real-Time Collaboration

Solution

The Proposed construction management app is aimed at addressing these challenges by providing a minimalist and user-friendly platform that allows construction teams to easily collaborate.

Assign tasks to each other, and track project progress in real time.

By simplifying the task management process and enhancing communication.

The app will enable teams to improve efficiency, accountability, and project delivery in the construction sector.

Project Timeline

Week 1

Week 2

Week 3

Week 4

Week 5

Week 6

Discover

Define

Ideate

Design

Testing

I Unraveled an interactive user research, collected data from other mobile devices, did some google searches and tried to create a user-audience design approach, focusing on users and their collaborators at every stage.

Design Process

User-centered design (UCD) is an iterative design process in which i focus on the needs of the users and the stakeholders in each phase of the design process. In UCD, I involve users throughout the design process via a variety of researches and design techniques to create a highly usable and accessible products.

Discover

Uer Research

Stakeholder interview

Heuristic Analysis

Define

Persona

Journey Mapping

Ideate

Brain Storming

User Flow

Information Architecture

Paper Sketch

Design

Hi - Fi Wireframe

Interaction

Style Guide

UI Design

Testing

Usability Testing

User Story

Personas

User Flow

Information Architecture

Unique Paper Sketches

Low-Fidelity Screens

App Features - MVP 1

MVP is the first, simplified version of a product, designed to deliver essential features and core functionality. It allows early testing with real users to gather feedback, validate assumptions, and identify improvements. This lean approach helps prioritize development while minimizing risk and resource investment.

Peter is a Construction Worker

Both Peter and Sam get the respective job for an onsite work where they are both part of the same team for that project; Peter and Sam need to assign each other respective task for their domain at different phases of the work

Sam is an Electrician

User flow in UX design is the path users take to complete tasks within a product. It maps each step, guiding users seamlessly from start to finish. Effective user flows enhance usability by minimizing friction, ensuring logical progression, and helping users achieve their goals with ease, improving overall experience.

How might we help to peter and sam be supported in securing their roles and effectively assigning tasks and complete the task to each other in an onsite project?

These are concept sketches, a set of drawings or storyboard, representing the skeleton of the interface. The next level up is a low fidelity wireframe. Low fidelity wireframe include the most basic content and visuals and are usually static (not interactive)

Wireframes are the blueprint for the final design. They connect the underlying structure to the surface of a website or mobile application. But wireframes do not represent the visual design or convey the brand or identity.

Splash screen with a get started button

This is the landing page of the app once the user logs in. Here Peter can see the list of ongoing task, upcoming task and Finished jobs

Once tapped on the ongoing task card, it opens up the detailed view of the job card. this screen gives a lot of info about the job such as materials used and request for new materials also the timeline of the jobs and its different steps and the most important feature of marking a step competed and assigning the space to a next available worker. Also, this features a blueprint of the work space and locations of different workers in the space.

Once tapped on the “Mark as complete & Assign” button in the stepped, this modal pops up requesting the user to check the box if completed and check the next available person requires your space and tap on “Complete & Assign” to complete the action.

Once Peter complete and assign the space to Sam.

Sam wil receive phone notification regarding the assigned space for his upcoming task.

Sam taps on either the notification or the task card thi task details page will open for him. it will have a button to start the task and also an option to request for new material required for the job

Similarly once sam task is finished he will go ahead and mark it complete and assign the space to the next person

10.

Once Peter complete and assign the space to the next person an intimation is made on the task view screen and also the step is marked as completed with a assigned to text which is having a delete icon. through this delete icon Sam can cancel the assignment if he thinks there is extra work needed for that step.

Also if the user taps on any of the persons profile on the map a tool tip will prompt info about the person and tell you when he/she needs your work space.

5a.

Similarly a notification will be triggered in app regarding the new assignment.

8a.

And if Sam is already in the app a banner will pop for the same job alert. and new task gets added in the upcoming work section.

8b.

Similarly once tapped on “Mark as complete & Assign” Sam too will get a similar modal which he needs to check and assign the space to the next person which is peter in out scenario.

11.

If the user is an existing this login page appears next

If the user is a new user, he/she needs to register with SSO as this app is specific to the company user, thus Employee ID along with Work email is needed and the rest of the required fields.

Home Screen

Task View Details

Pop up completed task

Notification

Peter Activity

Sam Activity

Sam kerns

Electrician

Natuer

Friendly

Technological

Management

Mood Board

A mood board is a visual collage that combines images, colors, textures, and typography to capture the look and feel of a project. It serves as an inspiration guide, helping teams establish a cohesive aesthetic direction. Often used in design, mood boards clarify and communicate ideas before development begins.

Components are reusable, self-contained elements in design and development, such as buttons, forms, or navigation bars. They maintain consistency and efficiency across a project by following a unified style and functionality. Components help streamline design and coding, enabling faster iterations and a cohesive user experience throughout the product.