Boom Sports

Connecting Millions of Sports Fans via Fantasy Games

Boom Sports is a digital sports entertainment and technology startup designing and operating world-class, free-to-play fantasy games for partners such as Comcast/NBC Sports and XFL. With nearly 2 million players on our products, our goal is to connect every sports fan and shape the future of legal sports betting in America.

I worked as the very first UI/UX designer on the team to collaborate with cross-functional partners and be an advocate of the design culture.

 

PROJECT TYPE

Professional Work, 2B & 2C & Internal Tools (Mobile, Web)

MY ROLE

UI/UX Designer

 

DURATION

2019-2020

TEAM

Clients, Stakeholders, Product Managers, Operation Managers, Engineers, Visual Designers

 

Clients I have worked for

Artboard.png
Artboard Copy 24.png
Artboard Copy 25.png
Artboard Copy 26.png

Unfortunately due to NDA, I can't share too much detail about my projects. But below, I’ll provide a general overview of what each project is about. If you would like to learn more about my design process, let’s chat :)

 

Things I’ve Contributed to

  • Launched the PlayBarstool app, which received a 5.0 app store rating based on 3K+ reviews within the first week of launch.

  • Launched the PlayXFL and Nascar Finish Line apps, which gained 300K users within two months and ranked 2nd and 5th on the app store top chart for sports.

  • Led user research and end-to-end design for 2 pitch projects, 1 cross-platform product and 1 web-based data analytics internal tool.

  • Advocating UX design by initiating company design reviews and workshops.

  • Collaborating with product managers, engineers and designers to implement ready-to-launch products.

01. Nascar Finish Line App

MY ROLE:

I was responsible for the Final Visual Design Iterations, Logo Iterations, Illustrations, Motion Design, Implementation, and App Store Screenshot Design. During this project, I successfully proposed β€œZeplin” to the engineering team, learned a lot about collaborating with engineers, being adaptable about last-minute client requirement changes, and being intentional about each design decision.

IMPACT:

  • Launched in Feb, 2020. Link to app store

  • Partnership with Nascar.

  • Gained 150K Users within two months.

  • Ranked No.5 on the app store top chart for sports during the game season.

Artboard Copy 27.png

02. Play XFL App

IMPACT:

  • Launched in Feb, 2020. Link to app store

  • Partnership with XFL.

  • Gained 150K Users within two months.

  • Ranked No.2 on the app store top chart for sports during the game season.

MY ROLE:

I was responsible for the Data Report Design, User Testing, Iterations, and App Store Screenshot Design. During this project, I learned Invision Studio for prototype and animation purposes, presented my design decisions, and iterated based on user/client feedback. 

Artboard Copy 28.png

03. NBC Sports Predictor App

IMPACT:

  • A 4.8 rating app based on 4K+ Reviews. Link to app store

  • Partnership with Comcast/NBC Sports.

  • Leveraged user engagement of NBC Sports Streaming App by 10%.

MY ROLE:

I was responsible for NBC-Lobby Contest Card Design, NBC Regional Game Feature Pitch, User Testing and Iterations, and CRM Data Analysis Internal Tool. This app was launched in 2018 and has been constantly evolving. During this project, I built the sketch symbol library, held workshop, and learned how to create innovative design based on the original design system.

Artboard Copy 29.png

04. Play Barstool App

IMPACT:

  • A 5.0 rating based on 3K+ Reviews. Link to app store

  • Partnership with Barstool Sports.

  • Great Client satisfaction.

MY ROLE:

I was responsible for Stoolstream Contest Card Design, High-fi Design Iterations, Design Library Creation, NFL Game Iterations, Asset Creation (Icons, Headshots, Helmets changes), Implementation, and App Store Screenshot Design. During this project, we reinvented a new design-engineer collaboration pipeline to allow designers directly input CSS/HTML to improve engineering efficiency by 40%.

Artboard Copy 30.png

What I Learned at Boom Sports:

  • Design for use cases and business, not for trend.

    When I first joined Boom, I realized how different our visual design style is from the current minimalism/clean UI trend. I was once frustrated about it; however, I later learned that design is all about context. We are designing in the sports betting and casino industry for a specific target audience group, and we need to follow the design guidelines from our clients and leaderships. Each design decision is not for β€œfitting into the trend” but for β€œdesigning for the actual user and business needs.” In our case, it is about how to use design for the best monetization strategy within a limited app lifetime.

  • Always seek chances to learn. If you don’t have senior designers, learn from PMs, Engineers, and Leaderships.

Boom has a culture of focusing more on the product and engineering team since established. Therefore, as one of the first UI/UX designers, we don’t necessarily have an established design team or senior designers to learn from yet. Most of the time, I have to navigate in the design space on my own and not sure where to get the design mentorship. However, I realized soon that learning does not only exist in the design space, it exists everywhere. Therefore I started spending a lot of time speaking and collaborating with engineers to understand what their current needs/frustrations are and try to help out. They kindly explained coding knowledge to me and we ended up inventing a new pipeline that allows designers to provide CSS directly into the production workflow, which shrinks engineering effort by 40%.

  • Take initiative, contribute to team-building, and don’t be afraid to speak up your mind.

    I have always been the type of person who continually seeks opportunities to improve efficiency and collaboration in a workflow. What I enjoyed most at Boom was being able to stand in the intersection of product, engineering, and design. This gives me a chance to understand the company structure and production workflow better. After months of observation, I initiated the very first design workflow review and presented the leadership ways that could make cross-functional teams collaborate better. It achieved great success, and 90% of the suggestions were taken and implemented. I have also been advocating for UX design by leading user researches, presenting new ideas, and organizing UX workshops.

  • Be passionate about the problem, transparent about the process, and open to the solutions.

    One of the most important things I have learned in the workspace is that: it is not a competition where you need to prove you are the best one on the team. Instead, it is a collaboration where all team members work together to achieve the end goal. I used to take on projects that I am not good at and try to spend a lot of time solving it on my own to prove β€œI can do it.” However, it not only wastes my teammate’s time but also doesn’t always have the best result. I realized that it is ok to admit that β€œI don’t know how to do it” and seek help. Be transparent about your concerns, and be open to ideas that can benefit the company overall. In this way, you will bring the most value and efficiency to projects.

  • Understand fully about the timeline, context, and requirements before start. Be visionary but also practical.

    A designer can make a perfect redesign of the whole app. But if it is launching tomorrow, it will be impossible for the engineering team to re-do everything. It is crucial to understand the constraints and needs. Make the best design for practical use, not for personal satisfaction. It will save time and energy for both sides and be efficient at the same time.

  • Be proactive and get to know your colleagues. A better connection can lead to a better work experience.

    One thing that I wish I could do better is to get to know my colleagues on a personal level. During my time at Boom, I was mainly talking to my manager and 2-3 teammates on my team. One time, I reached out to our social media manager to chat about his understanding of user behavior, and I was so inspired to learn his story, insights, and daily job. It gives me a brand new perceptive of looking at our products and a more homie work experience. I deeply value the human relationship. As designers, we care about and emphasize with our users. But we also need to pay attention to and connect with teammates/people around us. Try to schedule a 1:1 meeting with someone you have never spoken with before, and you will be surprised how inspiring it is to learn each other’s stories. Take care and check in with each out during this remote working time ;)  

 

Understand Context

When I am given a project, the first thing I will do is to understand the context: Is it a continued project or a brand-new project? What’s business goal? What are some details and client context? Is there any research done previously? Who will I be working with? What is the timeline, device, or other constraints? What is the technical capability?

 
Interview Stakeholder

Interview Stakeholder

Consult Engineer

Consult Engineer

Understand Client’s Branding

Understand Client’s Branding

 

Conduct Research

Depending on the different timeline and requirements of each project, I will adjust the research amount and method accordingly. Sometimes include Quantitative Research with the data team, Qualitative Interviews, and Competitive Analysis. Persona and storyboard will be made depending on the complexity of the problem and the team I am working with to make sure everyone is on the same page. 

 
Quantitative Research

Quantitative Research

Qualitative Interviews

Qualitative Interviews

Competitive Analysis

Competitive Analysis

 

Design & Iteration

I usually start with sketches and translate them into low-fi wireframes. Then I will check in with stakeholders/PMs to make sure I am heading in the right direction. Then, I will make the high-fi prototype and iterate on it based on internal user testing and the client's feedback.  

 
Design in Sketch

Design in Sketch

Prototype in Figma

Prototype in Figma

Iterate based on Feedback

Iterate based on Feedback

 

Final Delivery

I will hand over the final design to the engineering team and make iterations sometimes for more straightforward implementation. Though I usually get engineers involved at the very early stage of the product design life cycle to understand what's feasible. We'll also encounter some more specific problems in terms of the final design. Therefore, a lot of meetings, negotiations and documentation will happen during this stage.

 

Thanks for viewing :)

If you want to learn more about my work experience, Let’s chat!