SOFTWARE UI MOCKUP

BadgePass GO

Objective: This was a pretty big project to tackle, I was tasked with creating the entire UI layout, creating the logo, icons, example badge designs, everything. The UI mockups was for BadgePass’ second mobile application, BadgePass GO.

Approach: I started the project off by doing a proper discovery and researching layouts both in BadgePass’ industry along with other well-done technology applications, just so I could get an idea of what’s been done, what’s been done well and what’s been done well that we could potentially implement in our application.

I didn’t have a logo created with the first few drafts, the priority was drafting out layouts first and creating the logo second. I relied on my experience with websites viewed on mobile – header/footer navigation, image carousels, modals and icons – along with research of mobile apps to create my drafts.

Results: Clean and contemporary mobile UI mockup, that consisted of the primary windows and navigation to efficiently get around the, app was created. It was a collaborative, back-and-forth process between myself, the product owners and the software development team, but we managed to finalize a layout for BadgePass GO.

DRAFT 01

DRAFT 02

DRAFT 03

DRAFT 04

ICONS
































DRAFT 05

DRAFT 06

DRAFT 07

DRAFT 08

DRAFT 09

FINALS