2020

  • Frontend Development
  • Graphic Design
  • UI Design
  • UX Design
  • Web Design
  • Icon
  • Mockup
  • Prototype
  • Website
  • Web App
  • Sketch
  • HTML
  • CSS
  • Javascript

Millersville University's Ware Center asked us to recreate their theater programs for the 2020 season. Our custom web-app brought a fresh, environmentally friendly, accessibility-forward, and COVID-safe update to a classic form.

Screens

MU Arts Live Web App leaderboard screen on mobile MU Arts Live Web App home screen on desktop

Leaderboard and Home pages

Live mode

We didn't want the glow of screens to distract from peformances in a dark theater, so once a performance is underway the app automatically transitions to a dark color scheme.

MU Arts Live Web App profile screen on desktop MU Arts Live Web App program screen on mobile

Profile & Event pages

Gamifying the Experience

To encourage patrons to use the app and explore its features, we designed gooey icons, a leaderboard system for attendance, and badges for different usage milestones.

  • help icon for Arts MU Live at the Ware Center
  • settings icon for Arts MU Live at the Ware Center
  • picture icon for Arts MU Live at the Ware Center
  • program icon for Arts MU Live at the Ware Center
  • livemode icon for Arts MU Live at the Ware Center
  • leaderboard icon for Arts MU Live at the Ware Center
  • read icon for Arts MU Live at the Ware Center
  • checkin icon for Arts MU Live at the Ware Center
  • ticket icon for Arts MU Live at the Ware Center
  • has ticket icon for Arts MU Live at the Ware Center
  • library icon for Arts MU Live at the Ware Center
  • in library icon for Arts MU Live at the Ware Center
  • bookmark icon for Arts MU Live at the Ware Center
  • bookmarked icon for Arts MU Live at the Ware Center
  • favorite icon for Arts MU Live at the Ware Center
  • favorited icon for Arts MU Live at the Ware Center
scan of letterpressed RSVP card

Line Layer

scan of letterpressed details card

Shine Layer

scan of letterpressed after party insert

Color Layer

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK

  • TKTK

    TKTK