Mobile Attendance System

A UI/UX design I recreated during the 'UI/UX Design Using Figma' webinar hosted by Gordon College, Olongapo City, issued Oct 2023.

Client
Gordon College Webinar Project (Oct 2023)
Services
UI/UX Design, Mobile App Design, Wireframing, Figma Prototyping
Timeline
Webinar Duration

The Challenge

During the Gordon College webinar on UI/UX Design Using Figma, the challenge was to design a functional mobile attendance system from scratch. This required understanding user workflows for clock-in/clock-out functionality, creating intuitive interfaces for time tracking, and ensuring the design was both visually appealing and highly functional for daily use by employees or students.

The Approach

I followed the webinar instructor's guidance while adding my own design touches. The process included creating low-fidelity wireframes to establish the basic layout and user flow, then developing high-fidelity mockups with proper color schemes, typography, and spacing. I designed both clock-in and clock-out screens with clear visual feedback, added a notes feature for context tracking, and ensured the interface was simple enough for quick daily interactions. The design prioritized clarity, ease of use, and minimal steps to complete common tasks.

Mobile Attendance System media 1
Mobile Attendance System media 2
Mobile Attendance System media 3
Mobile Attendance System media 4
Mobile Attendance System media 5

Key Results & Impact

  • Successfully completed webinar project demonstrating Figma proficiency
  • Created functional wireframes and high-fidelity mockups for mobile app
  • Designed intuitive clock-in/clock-out flow requiring minimal user interaction
  • Implemented clear visual hierarchy for time-critical information
  • Gained certification from Gordon College for UI/UX Design Using Figma
  • Applied user-centered design principles to real-world attendance tracking scenario

Check out some of my recent projects