Product Design
·
Hoosier Lottery
·
2019
UX / Product Design
Web & Mobile
2018
Hoosier Lottery
Hoosier
Lottery
I led the creative vision for seasonal milestones, partnering with copywriters to pitch and execute full-scale digital, print, and out-of-home campaigns.
3.2M+
Monthly active players
6 mos
Discovery to handoff
8
Screens designed
6
Core flows redesigned
00
Overview
The Challenge
hoosierlottery.com needed a comprehensive brand refresh and digital modernization to better engage local communities. Mobile traffic continued to surge, but existing touchpoints lacked a unified visual identity, cohesive ticket-to-digital translation, and effective cross-channel campaign synergy across web, social, email, and out-of-home media.
My Role
Art Director & Lead UI Designer — Spearheaded creative vision and UI layout systems for seasonal milestones and game launches. Partnered with copywriters and engineering leads to direct multi-channel campaigns, translate physical scratch-off ticket artwork into accessible digital UI, present pitches to stakeholders, and build reusable production kits.
The Outcome
A unified, community-focused digital campaign ecosystem supported by scalable UI layout systems, accessible web components, reusable email/social production templates, and seamless print and out-of-home extensions—ensuring brand consistency, faster rollout timelines, and elevated player engagement.
01
Process
01
Discovery
Stakeholder interviews
Brand & UI evaluation
Physical ticket & retail audit
Campaign archive deep-dive
02
Research
Community & player insights
User interviews
Team creation
Storytelling alignment
03
Concepting & Systems
Early mood boards & art direction
Wireframes & responsive page layouts
Stakeholder concept pitches
04
Visual & Production
Campaign visual execution
Reusable email & social kits
Hi-fi UI screens & component design
Cross-channel asset adaptation
05
Delivery & Hand-off
Engineering dev handoff
Spec docs
Final campaign asset production
Print & OOH print support
02
Research & Discovery
What we learned from
real players
After moderated sessions with Indiana lottery players—casual scratchers, committed draw-game players, and 2nd Chance enthusiasts. Three core behavioral patterns emerged:
1
Players want fast answers first — checking winning numbers and ticket results takes priority over browsing.
2
Brand disconnect online — retail excitement and physical ticket energy weren't translating to digital channels.
3
Inconsistent experience — disconnected layouts across web, social, and mobile created player confusion.
Mobile
Mobile Priority
Majority of session traffic came from mobile devices while viewing legacy desktop layouts.
#1
Pain Point
Checking winning draw numbers and ticket results was the primary task for returning players.
Disconnect
Brand Disconnect
Physical scratch-off excitement and campaign energy didn't transfer to digital touchpoints.
Visibility
Campaign Visibility
Key promotional campaigns and 2nd Chance entries were hidden deep in secondary navigation.
03
CONCEPT & LAYOUT EXPLORATION
Layout exploration
We moved quickly into high-fidelity layout concepts to pressure-test the new information architecture and visual hierarchy in context. Early design directions were evaluated to refine navigation flows before locking in final production assets.
Homepage
myLOTTERY
04
Visual Exploration
Bringing energy to digital
We transformed Hoosier Lottery’s vibrant brand identity into a modern web system. By balancing visual energy with WCAG accessibility standards, we created intuitive digital layouts that elevate the player experience across desktop and mobile.
Web — Subpage Header
Approved
Web — Account Page
Approved
Pattern & texture system
Web — Full page hi-fi
Final delivery
05
Component Library
Color tokens
Brand Red
Lottery Yellow
Coral
Teal
Ink
Cream
Paper
Sand
Button states
Hover each button to preview state transitions. All states meet WCAG AA contrast.
Play Now
Primary
Play Now
Default
Link states
Hover to preview interactive behavior across contexts.
Previous draw results
inline
Privacy Policy
Ghost
Component explorations
Game card variants
Web + Mobile
Form
Web + Mobile
Promotional modules
Web + Mobile
06
End-to-End User Flow
From homepage to
ticket entry
The core mobile flow covers game discovery, checking draw results, and entering 2nd Chance promotions, streamlining the highest-volume tasks for players on mobile devices.
1
Homepage — Game Discovery
Player lands on the homepage. Featured seasonal games surface immediately with clear visual hierarchy, while winning numbers are accessible right above the fold.
2
Game Browse & Filter
Players filter games by category (Scratch-offs, Draw, Fast Play) or price point. Game cards highlight jackpot sizes, play styles, and top prizes at a glance.
3
Game Detail
Selected game opens to a full breakdown showing prize structures, odds, retailer locators, and direct promotional details.
4
Draw Results Check
Quick access to winning numbers from the main nav or game page. Recent draw results load instantly with intuitive date filtering.
5
2nd Chance Entry
Players easily scan or manually enter eligible non-winning tickets into 2nd Chance drawings through a streamlined, mobile-optimized form.
6
Account & myLOTTERY Benefits
Authenticated state surfaces player preferences, promotional entry history, upcoming draw alerts, and personalized game recommendations.
07
Social & Campaign Assets
Campaign-ready
everywhere
The design system was extended into social-first asset templates, including Instagram stories, feed posts, display banners, and email headers—ensuring seamless brand alignment across all digital campaign touchpoints.
08
Outcome & Reflection
Unified System
Cross-Channel Consistency
Created a single visual language across web, social, and campaign assets.
Streamlined Entry
Optimized 2nd Chance Flow
Simplified multi-step forms and promotional ticket entry for mobile users.
Faster Workflows
Reusable Production Kits
Dramatically cut asset creation time for recurring seasonal ticket rollouts.
Brand Elevation
Ticket-to-Digital Experience
Seamlessly translated physical scratch-off ticket artwork into digital UI.
Skills & tools used
User Research
Adobe Creative Suite
Information Architecture
Wireframing
Usability Testing
Visual Design
Design Systems
Stakeholder Presentations
Product Design
·
Hoosier Lottery
·
2019
UX / Product Design
Web & Mobile
2018
Hoosier Lottery
Hoosier
Lottery
I led the creative vision for seasonal milestones, partnering with copywriters to pitch and execute full-scale digital, print, and out-of-home campaigns.
3.2M+
Monthly active players
6 mos
Discovery to handoff
8
Screens designed
6
Core flows redesigned
00
Overview
The Challenge
hoosierlottery.com needed a comprehensive brand refresh and digital modernization to better engage local communities. Mobile traffic continued to surge, but existing touchpoints lacked a unified visual identity, cohesive ticket-to-digital translation, and effective cross-channel campaign synergy across web, social, email, and out-of-home media.
My Role
Art Director & Lead UI Designer — Spearheaded creative vision and UI layout systems for seasonal milestones and game launches. Partnered with copywriters and engineering leads to direct multi-channel campaigns, translate physical scratch-off ticket artwork into accessible digital UI, present pitches to stakeholders, and build reusable production kits.
The Outcome
A unified, community-focused digital campaign ecosystem supported by scalable UI layout systems, accessible web components, reusable email/social production templates, and seamless print and out-of-home extensions—ensuring brand consistency, faster rollout timelines, and elevated player engagement.
01
Process
01
Discovery
Stakeholder interviews
Brand & UI evaluation
Physical ticket & retail audit
Campaign archive deep-dive
02
Research
Community & player insights
User interviews
Team creation
Storytelling alignment
03
Concepting & Systems
Early mood boards & art direction
Wireframes & responsive page layouts
Stakeholder concept pitches
04
Visual & Production
Campaign visual execution
Reusable email & social kits
Hi-fi UI screens & component design
Cross-channel asset adaptation
05
Delivery & Hand-off
Engineering dev handoff
Spec docs
Final campaign asset production
Print & OOH print support
02
Research & Discovery
What we learned from real players
After moderated sessions with Indiana lottery players—casual scratchers, committed draw-game players, and 2nd Chance enthusiasts. Three core behavioral patterns emerged:
1
Players want fast answers first — checking winning numbers and ticket results takes priority over browsing.
2
Brand disconnect online — retail excitement and physical ticket energy weren't translating to digital channels.
3
Inconsistent experience — disconnected layouts across web, social, and mobile created player confusion.
Mobile
Mobile Priority
Majority of session traffic came from mobile devices while viewing legacy desktop layouts.
#1
Pain Point
Checking winning draw numbers and ticket results was the primary task for returning players.
Disconnect
Brand Disconnect
Physical scratch-off excitement and campaign energy didn't transfer to digital touchpoints.
Visibility
Campaign Visibility
Key promotional campaigns and 2nd Chance entries were hidden deep in secondary navigation.
03
CONCEPT & LAYOUT EXPLORATION
Layout exploration
We moved quickly into high-fidelity layout concepts to pressure-test the new information architecture and visual hierarchy in context. Early design directions were evaluated to refine navigation flows before locking in final production assets.
Homepage
Homepage
Homepage
myLOTTERY
04
Visual Exploration
Bringing energy to digital
We transformed Hoosier Lottery’s vibrant brand identity into a modern web system. By balancing visual energy with WCAG accessibility standards, we created intuitive digital layouts that elevate the player experience across desktop and mobile.
Web — Subpage Header
Approved
Web — Account Page
Approved
Pattern & texture system
Web — Full page hi-fi
Final delivery
05
Component Library
Color tokens
Brand Red
Lottery Yellow
Coral
Teal
Ink
Cream
Paper
Sand
Button states
Hover each button to preview state transitions. All states meet WCAG AA contrast.
Play Now
Primary
Play Now
Default
Link states
Hover to preview interactive behavior across contexts.
Previous draw results
inline
Privacy Policy
Ghost
Component explorations
Game card variants
Web + Mobile
Form
Web + Mobile
Promotional modules
Web + Mobile
06
End-to-End User Flow
From homepage to
ticket entry
The core mobile flow covers game discovery, checking draw results, and entering 2nd Chance promotions, streamlining the highest-volume tasks for players on mobile devices.
1
Homepage — Game Discovery
Player lands on the homepage. Featured seasonal games surface immediately with clear visual hierarchy, while winning numbers are accessible right above the fold.
2
Game Browse & Filter
Players filter games by category (Scratch-offs, Draw, Fast Play) or price point. Game cards highlight jackpot sizes, play styles, and top prizes at a glance.
3
Game Detail
Selected game opens to a full breakdown showing prize structures, odds, retailer locators, and direct promotional details.
4
Draw Results Check
Quick access to winning numbers from the main nav or game page. Recent draw results load instantly with intuitive date filtering.
5
2nd Chance Entry
Players easily scan or manually enter eligible non-winning tickets into 2nd Chance drawings through a streamlined, mobile-optimized form.
6
Account & myLOTTERY Benefits
Authenticated state surfaces player preferences, promotional entry history, upcoming draw alerts, and personalized game recommendations.
07
Social & Campaign Assets
Campaign-ready
everywhere
The design system was extended into social-first asset templates, including Instagram stories, feed posts, display banners, and email headers—ensuring seamless brand alignment across all digital campaign touchpoints.
Banner 728×90
IG Story 1080×1920
Email header
Feed 1080×1080
Display 300×250
08
Outcome & Reflection
Unified System
Cross-Channel Consistency
Created a single visual language across web, social, and campaign assets.
Streamlined Entry
Optimized 2nd Chance Flow
Simplified multi-step forms and promotional ticket entry for mobile users.
Faster Workflows
Reusable Production Kits
Dramatically cut asset creation time for recurring seasonal ticket rollouts.
Brand Elevation
Ticket-to-Digital Experience
Seamlessly translated physical scratch-off ticket artwork into digital UI.
Skills & tools used
User Research
Adobe Creative Suite
Information Architecture
Wireframing
Usability Testing
Visual Design
Design Systems
Stakeholder Presentations
Product Design
·
Hoosier Lottery
·
2019
UX / Product Design
Web & Mobile
2018
Hoosier Lottery
Hoosier
Lottery
I led the creative vision for seasonal milestones, partnering with copywriters to pitch and execute full-scale digital, print, and out-of-home campaigns.
3.2M+
Monthly active players
6 mos
Discovery to handoff
8
Screens designed
6
Core flows redesigned
00
Overview
The Challenge
hoosierlottery.com needed a comprehensive brand refresh and digital modernization to better engage local communities. Mobile traffic continued to surge, but existing touchpoints lacked a unified visual identity, cohesive ticket-to-digital translation, and effective cross-channel campaign synergy across web, social, email, and out-of-home media.
My Role
Art Director & Lead UI Designer — Spearheaded creative vision and UI layout systems for seasonal milestones and game launches. Partnered with copywriters and engineering leads to direct multi-channel campaigns, translate physical scratch-off ticket artwork into accessible digital UI, present pitches to stakeholders, and build reusable production kits.
The Outcome
A unified, community-focused digital campaign ecosystem supported by scalable UI layout systems, accessible web components, reusable email/social production templates, and seamless print and out-of-home extensions—ensuring brand consistency, faster rollout timelines, and elevated player engagement.
01
Process
01
Discovery
Stakeholder interviews
Brand & UI evaluation
Physical ticket & retail audit
Campaign archive deep-dive
02
Research
Community & player insights
User interviews
Team creation
Storytelling alignment
03
Concepting & Systems
Early mood boards & art direction
Wireframes & responsive page layouts
Stakeholder concept pitches
04
Visual & Production
Campaign visual execution
Reusable email & social kits
Hi-fi UI screens & component design
Cross-channel asset adaptation
05
Delivery & Hand-off
Engineering dev handoff
Spec docs
Final campaign asset production
Print & OOH print support
02
Research & Discovery
What we learned from
real players
After moderated sessions with Indiana lottery players—casual scratchers, committed draw-game players, and 2nd Chance enthusiasts. Three core behavioral patterns emerged:
1
Players want fast answers first — checking winning numbers and ticket results takes priority over browsing.
2
Brand disconnect online — retail excitement and physical ticket energy weren't translating to digital channels.
3
Inconsistent experience — disconnected layouts across web, social, and mobile created player confusion.
Mobile
Mobile Priority
Majority of session traffic came from mobile devices while viewing legacy desktop layouts.
#1
Pain Point
Checking winning draw numbers and ticket results was the primary task for returning players.
Disconnect
Brand Disconnect
Physical scratch-off excitement and campaign energy didn't transfer to digital touchpoints.
Visibility
Campaign Visibility
Key promotional campaigns and 2nd Chance entries were hidden deep in secondary navigation.
03
CONCEPT & LAYOUT EXPLORATION
Layout exploration
We moved quickly into high-fidelity layout concepts to pressure-test the new information architecture and visual hierarchy in context. Early design directions were evaluated to refine navigation flows before locking in final production assets.
Homepage
Homepage
Homepage
Homepage
myLOTTERY
04
Visual Exploration
Bringing energy to digital
We transformed Hoosier Lottery’s vibrant brand identity into a modern web system. By balancing visual energy with WCAG accessibility standards, we created intuitive digital layouts that elevate the player experience across desktop and mobile.
Web — Subpage Header
Approved
Web — Account Page
Approved
Pattern & texture system
Web — Full page hi-fi
Final delivery
05
Component Library
Color tokens
Brand Red
Lottery Yellow
Coral
Teal
Ink
Cream
Paper
Sand
Button states
Hover each button to preview state transitions. All states meet WCAG AA contrast.
Play Now
Primary
Play Now
Default
Link states
Hover to preview interactive behavior across contexts.
Previous draw results
inline
Privacy Policy
Ghost
Component explorations
Game card variants
Web + Mobile
Form
Web + Mobile
Promotional modules
Web + Mobile
06
End-to-End User Flow
From homepage to
ticket entry
The core mobile flow covers game discovery, checking draw results, and entering 2nd Chance promotions, streamlining the highest-volume tasks for players on mobile devices.
1
Homepage — Game Discovery
Player lands on the homepage. Featured seasonal games surface immediately with clear visual hierarchy, while winning numbers are accessible right above the fold.
2
Game Browse & Filter
Players filter games by category (Scratch-offs, Draw, Fast Play) or price point. Game cards highlight jackpot sizes, play styles, and top prizes at a glance.
3
Game Detail
Selected game opens to a full breakdown showing prize structures, odds, retailer locators, and direct promotional details.
4
Draw Results Check
Quick access to winning numbers from the main nav or game page. Recent draw results load instantly with intuitive date filtering.
5
2nd Chance Entry
Players easily scan or manually enter eligible non-winning tickets into 2nd Chance drawings through a streamlined, mobile-optimized form.
6
Account & myLOTTERY Benefits
Authenticated state surfaces player preferences, promotional entry history, upcoming draw alerts, and personalized game recommendations.
07
Social & Campaign Assets
Campaign-ready
everywhere
The design system was extended into social-first asset templates, including Instagram stories, feed posts, display banners, and email headers—ensuring seamless brand alignment across all digital campaign touchpoints.
Banner 728×90
IG Story 1080×1920
Email header
Feed 1080×1080
Display 300×250
08
Outcome & Reflection
Unified System
Cross-Channel Consistency
Created a single visual language across web, social, and campaign assets.
Streamlined Entry
Optimized 2nd Chance Flow
Simplified multi-step forms and promotional ticket entry for mobile users.
Faster Workflows
Reusable Production Kits
Dramatically cut asset creation time for recurring seasonal ticket rollouts.
Brand Elevation
Ticket-to-Digital Experience
Seamlessly translated physical scratch-off ticket artwork into digital UI.
Skills & tools used
User Research
Adobe Creative Suite
Information Architecture
Wireframing
Usability Testing
Visual Design
Design Systems
Stakeholder Presentations