reviews2

Minnesota State Lottery, UI/UX designer


Based in Winnipeg, Online Business Systems has over 30 years of experience in Digital Transformation and Cybersecurity consultancy working with Clients in Canada, USA and EMEA.

1. Role

Within my role as the UX Designer, I worked as a consultant for a company called Pollard Banknote which partners with lotteries around the world to create and market high performing instant games and solutions that excite and engage players. Focused on innovating within the lottery market, they also provide industry leading retail and digital solutions.

I supported the discovery track of web & mobile product development to validate ideas, learn and drive delivery of working designs with the help of wireframes, prototypes and Hi-Fidelity User Interface designs to build 2 end to end mobile applications (Minnesota and Kansas Lottery). I led several design ideation sessions and discussions presenting concepts, research findings, conceptual ideals, and detailed design rationales with stakeholders. Moreover with the help of shared libraries I delivered User Interface assets to front-end developers with instructions on white labeling/re-branding while creating a design system with style guide for responsive web and mobile app layout. Minnesota State Lottery Website and Mobile app.

reviews2
Mobile Screens (Minnesota State Lottery)

2. Challenge

The existing business was split across multiple platforms which was requiring Pollard to invest significantly in design resources. Hence they wanted to create a system that specializes in white-labeling Mobile and Responsive Web solutions, that offered a wide range of customizable features that can be added with company's branding and design elements.

reviews2
Atomic Design System Structure
3. Solution

I led the proposed solution of building design systems that could you be leveraged to cater towards unique design needs, rather than building every new feature from scratch. We were able to achieve this by integrating Brad Frost’s “Atomic design system” into our app development cycle.

Design systems contain user interface (UI) elements and patterns that can be reused in an app or website. The atomic design system further breaks down UI components into smaller, reusable elements called atoms, which can be combined to form molecules, organisms, templates. This systematic approach helps create scalable and consistent design systems with a collection of rules, including design principles, UI patterns, typography styles. This makes the experience feel smooth and seamless, often referred to as “user-friendly”.

reviews2
Atomic Design System Structure

Establishing these standards allowed us to promote efficiency between designers and developers thus maintaining UI development in a positive way. This allowed us to get the final product to market much quicker than if we wasted time building each element from scratch every time.

reviews2
Components in Design Library

Establishing these standards allowed us to promote efficiency between design and development thus maintaining UI development in a positive way. This allowed us to get the final product to market much quicker than if we wasted time building each element from scratch every time.

reviews2
White Labeling of Mobile Design