Hyun

My work and me

About Me

Hello, my name is Hyun — I am a designer and technologist creating symbiotic relationships between information and people. I am currently working with researchers, engineers and designers at IBM Research in Yorktown Heights, New York.
If you have any questions or have something in mind for discussion, please don't hesitate to contact me.

Commercial

Community

Recreational

Legacy

Wolf Performing Arts Center

Wolf Performing Arts Center

2013-14 — Commercial :: Lead Developer and Designer working at GDloft PHL

Teaser image for the Wolf Performing Arts Center project.

SYNOPSIS: How do you deliver a delightful software experience that brings pride and excitement to parents that have put their children in an awesome performing arts program? The best way to witness their children's growth is to actually attend the plays and programs. Similar to starting with an awesome appetizer at a restaurant and finishing with great desert, purchasing a ticket to a show is one of the most important parts of the experience.

Major Skills Applied

  • Visual Design
  • User Experience
  • Front-end Development
  • Back-end Development

This was one of my biggest projects while working under GDloft PHL. I have collaborated with Allan Espiritu, Principal Designer of GDloft PHL to create the user experience, and visual user interface. I have utilized my knowledge in HTML5, CSS3, PHP, MySQL, and JavaScript on a Linux/Apache/MySQL/PHP Stack to produce the front-end and back-end management solution to create and end to end experience.

Problem

BOTH parents as well as the owners of the Wolf Performing Arts program (known as the Wolf PAC) were frustrated with the technology they had to deal with. For the Wolf PAC Staff, they had to wait for an off-shore developer to update new shows and advertisements. The payment processing was a labor-intensive manual process. The manual procedures meant the parents who were waiting for updates or purchasing the tickets were often on hold or delayed, so the entire process was creating hinderance on both sides.

The personas below were created by conducting numerous interviews with the staff of the company as well as reviewing the feedback they have received from customers/parents.

For parents, the intent of utilizing the site was to simply purchase tickets for performances and sign up for classes. Other than that, it served no other purpose. The Wolf PAC staff wanted the website to be a central hub for updates, media distribution, and a community.
The new website needed to embrace the brand and history of the Wolf PAC. With the brand of the Wolf PAC, the website needed to show the real star: the children. The designers that were involved project decided to utilize photographs as the backbone of the design and use a bright color palette to represent youth.
Staff of the Wolf PAC behind the curtains needed a way to advertise tickets, classes and generally bring more traffic to the website. The existing issue of manual payment, class and ticket processing needed to be resolved a well.
Automation seemed to be the missing element for the staff of Wolf PAC. Creating a robust automated back-end system for the management of classes and tickets needed to be created.

Process

LEAPFROGGING, a method of design and development resembling AGILE, was applied during the creation of the project. I collaborated with designers to create a foundation and allocated my time to create such base in code. After the foundation was finished, small pieces of the design were created by other GDloft designers and then coded by me while other elements were being created by the designers.
A custom back-end and management system—that was tailored for non-technical staff of the Wolf PAC—was designed to add, edit, and process the offered classes and performance tickets. PHP and MySQL was used for the main back-end, while the traditional mix of HTML5, CSS3, and Javascript were powering the front-end. Previous projects like my Anonymous Thanks Project, and the AIGA Philadelphia Design Awards 2012 had allowed me to quickly code the back-end and the payment processor. The final product was delivered to the Wolf PAC staff members with instructions on how to manage the back-end.

Final Product

Screenshot of the homepage.
Screenshot of the homepage.
Screenshot of the available plays.
Screenshot of the available plays.
Screenshot of the details of a play.
Screenshot of the details of a play.