Avatar

Hi, I’m Roberto Perez

I solve real business problems by crafting laser-focused experiences. The iterative journey of quantitative and qualitative research and design enables me to confidently connect people with exceptional user experiences.

Spruce

Completely refreshed the homepage experience for Spruce to better inform our users.

Spruce

H&R Block

Promoting equal opportunities for female athletes in endorsements and representation.

H&R Block

USAA

Provided in-depth content to engage readers, enhance SEO, and build trust with our customers.

USAA

Sam's Club

Provided cost savings, variety, and exclusive membership benefits for both in-store and online shopping.

Sam's Club

eBay Ads

Created a targeted audience and offered cost-effective promotion for products and services.

eBay

Shopkick

Provided rewards and discounts for in-store and online shopping.

Shopkick

ABM Industries

Create Internal tool to manage Facebook campuses safe, efficient, and sustainable.

ABM Industries

Reel Code Media

Design and implement an immersive digital experience at Santa Clara's Levi's Stadium.

Reel Code

Major Tasks & Responsibilities

Contribute to the end-to-end design outcomes for all three lines of business (hrblock.com / blockadvisors.com / sprucemoney.com)

Design Tools Used

Adobe Creative Suite & Figma

Case Studies

Reel Code App
Reel Code App
Reel Code App

Overview

To determine how well the long-form article performs in helping users to understand how to read a home insurance estimate in order to:
1. Reduce claims status calls about home insurance estimates
2. Increase digital containment
3. Increase member satisfaction
4. Increase digital confidence

Research Goals

1. Understand if the article enables users to:
• Find information on how to read home insurance estimate
• How to submit an insurance estimate for their claim online
• Discover a video on how to read home insurance estimates.
2. To understand user perception of:
• Topic clarity
• FAQ
• General sentiment
3. To understand if Jump Links and sections are intuitive

Methodology

• Unmoderated UserZoom Study offered to a general audience
• Participants are given a scenario and are asked to navigate through the prototype
while thinking out loud to explain their decisions as they make them
• Follow-up questionnaire inquiring about their perception of the prototype experience.
• 16 participants (2 USAA Members)

Insights

Most Participants expressed increased confidence after reading/scanning through the article.• The article broke down how to read a home insurance estimate with
an example of a homeowners estimate. The example helped add
extra clarity.
• The estimate definitions gave participants assurance that they can
understand every line item in an estimate.
• Participants quickly learned the FAQ contained valuable content,
often skipping sections to read it.

Participant Feedback

Participants found the content of the article useful and informative.
Participants found the estimate examples and definitions to be
very useful in order to understand every element of the
homeowner's insurance estimate.

" Review the estimate overview gives
you a quick snapshot of your policy
coverage details, including coverage
types deductible, and policy limits for
the claim. This seems really easy to
follow, the coverage section shows the type of items covered by your policy such as your home or belongings."
– User #25

The FAQ section of the article was the "go-to" for unanswered questions.
The participants were able to scroll down and find additional
answers in order to have more context in regard to a section.
Recommendations
Use FAQ section to answer questions users most often
seek answers for.

"That's one of the things that I appreciate about USAA. They actually take the time even if it is in the FAQ section to explain so that you're confident in the knowledge that you have. Or at least know what questions you should be asking.”
- User 14

Recommendations
Visual elements of the estimate examples were useful to
understand the content. It helped break the content by section
to make it more scannable.
Use FAQ section to answer questions users most often
seek answers for.

Major Takeaways

A major revelation from usability testing was the detectability of icon usage and their placements within the models, how it made readability effortless.
We also discovered that our articles gave our members clarity and more knowledge about our services. It gave them the confidence to idependently start and complete claims online.

Next Steps

With the feedback we have received from our prototype, we encouraged our members to confidently find, inquire and resolve their claims.
In the middle of a branding refresh throughout USAA's organization, we were to iterate on our information architecture for our articles.

Long Form Article Site Map

Brand Refresh
As an organization, we were to transition our current articles to our new look and feel. Below are our aspirations for our new design look & feel for both web, mobile, and native apps.

New Design System
Marking a century of service, the USAA Design team collaborated to redefine their visual identity. I played a pivotal role in crafting an agile and sustainable design system using Figma. This strategic overhaul not only pays homage to USAA's history but also positions them for ongoing success, fostering innovation and efficiency within the design team. The result is a refreshed look that aligns with industry trends, ensuring continued relevance for years ahead.

Overview

H&R Block's A Fair Shot program returns in 2023 to champion gender equity in NIL deals and highlight tax implications. In collaboration with Fabletics and Jambys, the initiative addresses unequal NIL sponsorships for female student athletes. Following its successful debut, the program now celebrates 50 athletes across 13 sports, including underrepresented areas. It also expands to NCAA Divisions II and III, plus Historically Black Colleges and Universities, aiming to promote fairness and inclusivity.

Major Tasks & Responsibilities

Collaborate with our business partners to create a campaign page that will amplify the combined efforts of H&R Block and its brand partners, aimed at promoting fairness and inclusivity. My team and I were involved in the creation of the campaign landing page website.

Goal and Vision

Following the 2022 launch campaign, H&R Block successfully expanded athlete participation from 20 to 50 this year. Our actionable goal for this website is to effectively inform our audience about these individuals and compellingly share their stories as college athletes. Additionally, we aim to enhance engagement by strategically leveraging social media platforms and the athletes' personal channels to generate increased traction.

Design Tools Used

Adobe Creative Suite & Figma

Results

A Successful Year Two

13ppt

more campaign awareness than 2022

75%

were more favorable to H&R Block

95%

H&R Block is an option for Gen Z adults

Project Objective

Why
While progress has been made, there is still work to be done to achieve full gender equity in sports. This includes addressing disparities in funding, pay, and opportunities, as well as changing cultural attitudes and biases. Promoting women's participation in sports is not just about the games themselves; it's about promoting fairness, equality, and opportunities for all.
What
H&R Block wants to create a digital platform for universities to showcase women athletes to inspire other future generations to become familiar with all the financial resources and knowledge they can access while participating in sports. This will help them achieve success not only during their athletic careers but also after college graduation.
How
Showcase the selected athletes every year to help them be represented by their sport and university. Give them the digital presence by sharing their social media handles to bring more awareness of their personal brand. Provide them with digital resources for them to file their taxes if they get grants, scholarships, and edorsements.

Design Process

Site Map

Wireframes

Layout Concepts

Final Design

Credits

Creative Kenzie Tubbs, Jose Arellano, Trevor Stark, Roberto Perez Jr., Shayla Gordon, Becky Blackman
Insights Kate Michel, Brooke Minor
Adobe Target Mike Tolin
Web Authoring Rachel Nyp, Natalie Morgan, Matt Roiz, Mike Clifton

Overview

In the early months of 2023, our team received a request to revamp the homepage of Spruce, a mobile banking app committed to giving users a financial makeover.Our objective was to craft a new homepage design that not only showcased the core features of Spruce but also directed users toward creating an account. Through thorough research and analysis of user behavior on the existing homepage, our team developed multiple versions for moderated user testing, followed by A/B testing on the live site.Over a span of 6 months, we continuously refined the design through iterations, ultimately producing a homepage experience that effectively embodied the Spruce brand, highlighted key features, and significantly boosted the conversion rate for account sign-ups.

Major Tasks & Responsibilities

In 2023, we did a homepage audit, our findings gave us opportunities to improve our design and content to better inform our customers. Our goal was to come up with several homepage compositions and test them through user testing to learn from our users and see how we can transform our website.

Design Tools Used

Figma, Miro, and UserTesting

Results

500k

App Store downloads

70.2k

Total account signups

+6.8%

Website conversion rate

Project Objective

Why
When visiting the Sprucemoney.com homepage, user testing and Adobe test insights consistently show users do not know what Spruce is and struggle to engage with and understand product benefits.
What
A series of qualitative and quantitative homepage iteration tests to determine a more customer-centric Sprucemoney.com homepage. Version success is determined by account signup conversion rate and page engagement.
How
Build three (A/B/C) unique versions of the homepage creative for qualitative user testing analysis/insights. Based on those user testing insights, develop three revised versions for production testing via Adobe Target along with a Medallia survey to gauge user reaction.

First Round of User Testing

The revised page layout and new marquees highlight the benefits and features that matter most to our prospective users, supported by analytics, research, and insights data.Experience
• 3 new design concepts
• 3 separate tests
• Usertesting.com Participants
• 6 participants each, a total of 18
• 24-54
• United States
• $20K-$60K
• Financially coping or vulnerable
Format
• 3 separate homepage designs
• Mobile
• Each explored the first design and answered multiple questions
• They then explored the second and third designs for a shorter amount of time
Key Questions
• Do you know what Spruce is after viewing?
• Does this entice you to open a Spruce account or want to learn more?
• Did you want to navigate the page based on the content?
Goals
• Gain user reactions to the three different concepts
• Understand the comparative value of the various concepts
• Which are worth exploring further?
• Where should we narrow in and focus?
• Identify where we have not gone far enough
• What else are they looking for?
• Observe the usability of the overall flow and experience

Second Round of User Testing

Next steps
How might we explain what Spruce is in a way that is different from other financial tools, adds value, and helps them be better with money?
3 possible solutions
• All-in-one app
• Built by H&R Block Co-branding
• Budget Tracking

Option A
Focus on budgeting and managing money as a key feature, showcasing its uniqueness.

Option B
Highlight Spruce's relationship with H&R Block to build trust and legitimacy.
• Clarify the purpose behind Spruce's creation to increase interest and trust.
• Emphasize Spruce's financial background and how it helps users manage money better.

Option C
Explore the messaging of an "all-in-one app" to consolidate financial products and differentiate from competitors.

Page enhancements

• What is Spruce image/copy
• Bolder fees messaging
• Bolder ATM image/copy
• FDIC insurance & security messaging
• User testimonial
• Redesigned app download CTA

Learnings

May 30 - July 20 Page Clicks/ Unique Visitors
- Default: 22%
- Budget Tracking: 21%
- Relationship: 22%
- All in One: 25%
The Budget Tracking Marquee performed the best. This feature, based on our user feedback, was the one that they felt was unique and would be ideal for saving money. They like that it can be automated and the flexibility to do more within one app.

Final Design

Credits

Creative Kenzie Tubbs, Jose Arellano, Trevor Stark, Roberto Perez Jr., Shayla Gordon, Becky Blackman
Insights Kate Michel, Brooke Minor
Adobe Target Mike Tolin
Web Authoring Rachel Nyp, Natalie Morgan, Matt Roiz, Mike Clifton

ContextAt Sam’s Club, we’re committed to becoming the membership you love most. We will do this by providing excellent products and services – in clubs, online, and through mobile devices – across the U.S. and Puerto Rico.Major Tasks & ResponsibilitiesCreate in-app campaigns featured at samsclub.com for top-tier brands and Service partners.Design Tools UsedPhotoshop, Illustrator, InDesign & Sketch

Branded Styleguides
Collaborated with the design team by using style guides to ensure consistency and a refresh of look and feel to our seasonal site placements on our website and mobile app.

Branded Landing Pages
Created ADA-compliant ads that were made accessible to a variety of devices for both Android and iOS.

Site Placements
Below is a variety of ads I created during my time at Sam's Club. Working with Sam's club gave me the opportunity to work with a lot of brands. We were able to showcase new products and services on our platform to drive sales and leads nationwide.

ContexteBay is an inspired marketplace that fuels passion and celebrates individuality as users shop, sell, and discover their perfect version. It’s what makes us Uniquely eBay. We create, refine, and innovate user experiences across multiple platforms. We believe in designing intentional, useful, and elegant products that we're proud of and our customers love.Major Tasks & ResponsibilitiesCreate in-app campaigns featured at eBay.com for top-tier brands and Service partners.Design Tools UsedPhotoshop, Illustrator, Sketch, & InDesign

High-Fidelity Prototype

Branded Landing Pages

Monthly Newsletters

Animated Ads

Animated GIF: Gaming
Animated GIF: Laptops
Animated GIF: Smart Home

1P In-App Banners

3P In-App Banners

ContextIn 2018, I joined ABM Industries to create a team website for their janitorial staff at Facebook in Menlo Park, CA.The team website was much needed by the janitorial staff and management team to be efficient with communication, collaboration, and work tasks. This website would also enable ABM staffing to onboard a recruiting process to fully staff all Facebook campuses to meet their janitorial and event needs.RoleMy role was to research, ideate, design, user test, and develop the team Website. This project could not have been possible without the feedback and support of ABM operations, talent & development, management, and hourly staff to make this website possible.Tasks & ResponsibilitiesResearch, storyboard, sketch, wireframe, prototype, user test, and develop Team websiteDesign Tools / UX Methods UsedPhotoshop, Illustrator, Sketch, InVision, & User TestingProcess
My team and I conducted a series of design workshops, user studies, product walk-throughs, and countless iterations to:
- Highlight the most common patterns
- Identifying the overlap opportunities
- Define our design principles
- Define design teams' needs
-Define front end-to-end teams' needs
- The system support & communications iterative process

Personas
To empathize with the different types of users, we developed personas based purely on experience and assumptions. These serve as a starting point to reflect on the user's needs and challenges and possible solutions that can be considered later in building the information architecture.

Information ArchitectureTo use information architecture effectively, I first analyze my content and understand my users' needs and behaviors. Then, I create a hierarchical structure, implement metadata and tagging systems for enhanced searchability, and regularly review and refine the IA based on user feedback and evolving content requirements.

UX AuditTo understand the old site and its content, I ran a content audit listing all available information and features. Based on this, my team and I collectively decided what to keep, what to remove, and how content can be integrated into more intuitive information architecture.

SitemapThe site map enabled me to organize holistically the pages of the website. I also worked with some colleagues to determine where pages would be located on our home menu. Pages were organized by importance and priority to each of the team's needs.

Visual Style Guide

Brand Guidelines
Brand Guidelines

Final Compositions

Mobile User Flows
Web User Flows

LearningsI learned that having a diversity of users involved early in designing workflows was effeciive.The project had many challenges; the most difficult part was finding ways to create an ecosystem that has various user journeys all in one place to bring team members together to be more collaborative and efficient to meet their business needs.Result
After creating the website and keeping all digital and available files on the web, our onboarding process time was cut by 65%. We saw a better retention rate and better staff by the 3rd quarter of 2018.

Earning Rewards at Shopkick

ContextShopkick is an engaging shopping reward app in the United States. The platform connects digital and physical retail with beacon technology and rewards millions of users across the full path to purchase for actions such as walking into stores, scanning products, browsing content, and making purchases in-store and online. As a production designer at Shopkick, I worked with major retailers and brands, creating in-app campaigns that provided exclusive rewards to Shopkick users to increase product in-store and online sales.Tasks & ResponsibilitiesCreate in-app campaigns featured in the Shopkick app for significant brand and retail partners.Design Tools UsedPhotoshop, Illustrator, Sketch, & InDesign

Email AdsBelow is an example of an email banner I created for new partner launches, such as Torrid. These promotions were essential for informing loyal users to continue to visit these retailers and make the most of their shopping.Email banners also help users be engaged in contests as well as a variety of select dates where they can earn more kicks of their in-store engagement.

Earning Rewards at Shopkick

In-App Promo AdsSome of my work consisted of creating brand and retail lookbooks filled with content such as recipes, nutritional information, as well as insights in regard to product use and benefits. We also included video ads to be displayed in our app for users to be aware of new products as well as earning kicks to redeem gift cards.

In-App Branded LookbooksI also created in-app banners that included offers to encourage users to pick items from the shelf and scan them to redeem kicks. Kicks are available when the user makes a purchase and scans their receipts. Users can also walk to partnered stores and get kicks for stepping into the store to encourage users to view more products available for more offers.

Earning Rewards at Shopkick

In-App PromotionsAt Shopkick, I created a wide variety of in-app campaigns by which I also included web views. These web views are roadmaps to earning more kicks and making the most of purchases.On special occasions, users could win a lot more based on their shopping expenses. These ads also include dates as well as limited-time offers.

Earning Rewards at Shopkick
Jimmy Garoppolo

ContextReel Code is an app that allows users to unlock cool features such as ordering food, Making Fan Store Purchases, Fan Trivia, and more. It keeps fans engaged and aware of what Levi’s has to offer all in the palm of your hand. My role was to research, design, and test all user interfaces related to the project. I collaborated with design, product development, and engineering to launch this project.Tasks & ResponsibilitiesDevelop the UI to showcase as a demo to potential investorsDesign Tools / UX Methods UsedSketch, Flinto, InVision, Cardsorting, A/B TestingDesign ProcessOur Product and marketing team researched what technology was available at Levi’s Stadium and other local venues in the Bay Area. We discovered that a lot of time, promotions, and services are not implemented in digital form. Knowing that there is full Wi-Fi coverage around the stadium, there is an opportunity to give attendees a digital experience.Our Product and Engineering team created a digital experience for the San Francisco 49ers by implementing a branded barcode that would be scanned by our Reel Code Media app. Users can unlock four features that could be available for Levi’s attendees. These barcodes would be labeled on every seat at Levi’s Stadium, and users would be able to order food, purchase fan gear, participate in half-time trivia and view quarter-to-quarter game highlights.

PersonasBased on the storyboard, we identified and created two personas to us help us focus on and think holistically to prevent our own desires for features from trumping the user's needs.

WireframesCreating wireframes provided usability to the forefront in showcasing page layouts at their core. It promoted ease of use, conversion paths, naming of links, navigation placement, and feature placement. Wireframes can point out flaws in your site architecture or how a specific feature may work.

Low Fidelity Concepts

Brand Guidelines

Final Compositions

Holiday Pages

High-Fidelity Prototype

LearningsBased on my user research, I was surprised by how much utility a mobile app can provide users at a sports venue. Users appreciated the ability to have instant experiences such as ordering food and merchandise, participating in trivia, and watching quarterly videos and highlights.Key Performance Indicators (KPIs) such as increased user engagement, higher transaction rates, and improved customer satisfaction underscored the success of these features.I enjoyed going on-site to Levi’s Stadium and seeing where our QR codes would be present for users to scan the custom barcode and engage with our app features. Tracking KPIs such as the number of scans per game and the conversion rate from scans to interactions provided valuable insights into the effectiveness of our on-site implementation strategy.

Results

25K

App Downloads

+72%

Trivia Users

45k

Mobile Orders

Holiday Pages

I am Roberto Perez, a product designer with a passion for uncovering solutions through the lens of design thinking. My mission is to bring value and instill trust in customers by embracing empathy, inclusiveness, and accessibility as core principles in my work. Through thoughtful and user-centered design, I strive to create products that not only meet the needs of users but also enhance their overall experience.

Previously at H&R Block, USAA, Sam's Club, eBay, ABM Industries, Facebook, and Shopkick.Embracing emerging technologies to acquire new skills fuels my drive to innovate and shape the future. Beyond my design pursuits, I find joy in photography, reading, biking, and cherishing moments with my family. It's within these diverse interests that I draw inspiration, enriching both my personal and professional journey.I recently got nominated as a recipient for Design Rush 2024 Best Logo Designs.

Let's get in touch!