Geo Accessibility is a video series that provides accessibility guidance to Google Geo’s internal UX and UI teams. The goal for the series is to teach Googlers how to make their designs accessible to everyone, including people with disabilities. Topics ranging from color contrast, labels, touch targets, and more are covered.

There are three episodes total, each varying in length from two to six minutes. Each episode is a mix of live-action footage, curated b-roll, and graphics. To reinforce the concept of digital design and user interface, we incorporated visual accents such as grids, dashed lines, and a clean, monospace font, evoking the aesthetic of a wireframe. Leveraging our extensive experience in branding and UI design, we successfully translated complex design principles into a visually compelling and easily digestible format, making the process of inclusive design accessible to a wide audience.

Below is a sizzle reel with design and animation highlights from the series.

#fff

#000

Teaching Googlers how to design inclusively.

Accessibility Guidelines

Color contrast

Google

Contact

Vimeo

LinkedIn

Footer Links

Work

About

Services

Main Navigation

Lookout, Voice Access, and Action Blocks are Android apps built for people with visual impairments, mobility impairments, and cognitive impairments, respectively. These innovative products allow users to control their phone using only their voice, to be their set of eyes by detecting text and objects through the camera, and can launch common actions with a single tap of a button. For each app, we created a video that introduces the product (to boost awareness) and explain its value and use (to boost adoption).

The illustration style pairs Google’s iconic color palette with simple shapes and characters. By using the design principles of familiarity, contrast, and focus, each video is optimized for inclusivity and to improve visibility for people with visual impairments.

The videos were posted on Google’s main YouTube channel and have amassed hundreds of thousands of views.


Making Android apps accessible for all.

Speech

Voice Access allows users with limited mobility to control their Android phone using their only voice. Our goal was to showcase how easy the app is to use, along with different use cases.

Voice Access

Scroll down

Lookout is an innovative app that allows users with vision impairments to use their Android phone’s camera to detect text, objects, and explain the world around them. We did a lot of experiments to figure out how to best show low vision and the clarity that the app provides.

Lookout

Action Blocks is an app that allows users to quickly perform common tasks at the tap of a button.

Action Blocks

Accessibility Apps

We teamed up with our friends at Google to create a video in anticipation of the larger RCS rollout for iOS users. RCS (Rich Communication Systems) is a modern phone technology that will improve messaging for all. Already available for Android users, the technology will soon be adopted by Apple. It solves common bugs between Android and iOS users, such as the green/blue bubble wars, blurry photos and videos, broken group chats, and lack of typing indicators. The goal was to create a one minute, sizzle-style video to get people excited for what’s to come.

We utilized graphics, UI, and a strong music track to drive the narrative. The style was inspired by the Google Messages branding, with a healthy dose of emojis sprinkled in. The video was shared on Google and Android’s YouTube accounts, amassing 60k views within one week of posting. It helped guide the conversation around Apple’s adoption of RCS. A 30 second short form version was included in the final deliverables for use on social.

Better messaging for everyone with RCS.

RCS rollout

Dynamic trio

Hearts

RCS Rollout

Rebrand Video

Athena Club

We’ve partnered with Google for the past 6 years in creating self-help videos for the Pixel phone, resulting in over 2100 tips, each localized in 10 languages, for 6 consecutive phone launches. The tutorial style videos showcase the latest and greatest tips and tricks across favorite Google products like Maps, Search, and YouTube.

A mix of live action and animation, each tip is tightly coordinated across multiple production and features teams. Although the format seems simple, each tip takes 35 steps to make. We handle everything from scripting to final delivery, and have developed a proprietary system to capture localized Pixel UI workflows. We also provide pre-production guidance and on set technical direction.

The videos are preloaded on every Pixel phone and are posted to Google’s YouTube channel with hundreds of thousands of views, helping people all over the world.

Helping people all over the world use their Pixel phone.

Pixel Tips

In anticipation of enrollment season, Success Academy contacted Masonry to create a series of videos promoting their schools. The problem? There are so many great things about Success Academy that we could go on forever. No one has that time though, especially New Yorkers. So, we created a series of videos that each center around a specific aspect of the schools, all within a minute. Hence the concept "New York Minute".

The graphics are vibrant and utilize the school's impressive library of imagery. The stop-motion style animation is quick and snappy, with pulsating elements that evoke a sense of play. The VO and percussive tracks drive the fast paced energy of the video.

After the success of the first video, we were asked to create 2 more versions promoting different topics. Over 50 deliverables were created to be used on streaming platforms and social media.

The Best of Success Academy in a New York Minute.

Group of scholars

"Why Success?" serves as the series' introduction, exploring a diverse range of topics.

Why Success?

"Resources" is the second video in the series. It focuses on all of the free resources and activities available to Success Academy scholars.

Resources

Choose Success

"STEM" is the last video in the series.  It covers the science, technology, engineering, and math opportunities available at Success Academy.

STEM

New York Minute

Success Academy

Our work with Discovery’s Food Network Kitchen began in the Fall of 2019. Our partners needed 25-30+ episodes of hosted “cook-along” content edited and delivered on a monthly basis for their new app. Each episode ranges from 15-45 minutes in length.

We tapped our talented network of editors, mixers, and post-producers and quickly met the challenge. We have since delivered over 400 episodes of premium content (200+ hours and counting), hosted by star chefs such as Bobby Flay, Giada De Laurentiis, Martha Stewart, Ming Tsai, Alex Guarnaschelli, Michael Symon, and many others. The production coincided with Covid, resulting in some creative solutions. Chefs were sent camera equipment to film at home in their kitchens (sometimes with their mobile phone).

Our work on this began a collaboration on several other shows in the Discovery network umbrella such as Worst Cooks in America, I Am Jazz, and The Repair Shop. Below is a sizzle reel of the work done over the years.

Cook along with your favorite chefs.

Food Network Kitchen

Discovery

Success Academy is the largest free, public charter school in New York City. We created a promo video for them highlighting the new arts and athletics options available to students entering middle and high school. The goal of the video was to get kids excited about the activities they’ll soon have access to.

This was such a fun one to work on, and one of our favorite projects to date. The design direction is inspired by scrapbooks and utilizes torn paper, cut out shapes, nostalgic school-inspired textures, and eclectic typography. A tight color palette and consistent, repetitive use of graphic elements keeps the direction composed yet playful. Riffing off of the handmade look and feel, the animation approach features a stop motion style. The percussive track keeps the energy upbeat, and much care was taken with the sound design to ensure the two and a half minute video didn’t feel repetitive.

The video was played at multiple live events and is used as a promotion piece on their website and social media. The client loved the video so much that they asked us to create 3 different spinoff versions.

Extracurriculars take center stage at Success Academy.

Success Academy - Arts and Athletics

Dual enrollment

Logo

Basketball

Arts and Athletics

In another collaboration with Success Academy, we created a hype video for new hires to get them excited about their new role. We worked with existing footage, animated typography, and a custom percussive track to drive the story.

The video was played at a live event and shared as part of a welcome package for new teachers. The video made the rounds internally and was shared with various team members. Below are quotes of their reactions.

“So fucking good...Bravo...amazing”

“FUCK YES.”

The video was a hit. So much that they asked us to create a video for a different event in the same style.

Showing new teachers what’s possible.

Teacher onboarding

Teacher Onboarding

In 2022, Google Street View celebrated its 15 year anniversary. Google Street View is a technology featured in Google Maps and Google Earth that provides interactive panoramas from positions along many streets in the world. It’s a virtual tour where you can explore streets, landmarks, and businesses as if you were physically there.

Masonry worked in partnership with the Google Marketing team to create a 60 second video that captured the emotional essence of the Street View experience. Employing an original script, specialized UI capture, animation, and footage from all over the world, the goal was to emphasize the human aspect of Street view: one’s connection to home, community, meaningful memories, and aspirations.

Since the release, the video has been viewed over 2 million times and featured on various blogs such as TechCrunch and Travel + Leisure.

Celebrating 15 years of wonder.

Street View 15 Year Anniversary

Street View Anniversary

Summersalt

We created a vision video meant to inspire Googlers and show them what Google Maps could look like in 5-10 years. We collaborated with the Google Maps team to envision the future product and think outside the realm of what exists today. Custom live action was shot, using storyboards we developed for reference. The video breaks boundaries and shows viewers the possibilities of what’s to come. Due to the confidential nature of the video, we cannot share any more information on this project.

The future of an iconic app.

Vision Video

Google Maps

In anticipation of their new JW Marriott campaign, Mother Design tapped Masonry to bring their vision to life through animation. The ambitious project involved projecting the campaign videos onto dozens of buildings in Times Square, placing our work at the epicenter of New York City.

Given the immense scale and visibility of this campaign, meticulous attention to detail was paramount. Working within stringent technical specifications, Masonry meticulously synchronized the video content across dozens of screens, ensuring seamless playback and optimal visual impact. This demanding project required precise timing and coordination to guarantee flawless execution, a testament to our team's expertise in large-scale projects.

We were honored to contribute our animation skills to such a high-profile campaign and are immensely proud of the final result. The opportunity to have our work showcased in such a prominent and influential location was an incredible experience for our team.

Taking over Times Square.

Times Square Takeover

JW Marriott

We teamed up with Mother Design in the middle of their massive brand launch for Marriott Bonvoy. After merging with Starwood Hotels to become the world’s largest hotel portfolio, Marriott International engaged Mother Design to create a new global loyalty brand with a substantial challenge: combine Marriott Rewards, Starwood Preferred Guest, and Ritz Carlton Rewards under a new name and identity, and connect 100 million members, 30 brands, and 6500 properties worldwide. From this, Marriott Bonvoy was born.

We brought the logo and identity system to life through motion. Embedded in the wordmark is a “cursor”. This cursor is used throughout the identity to represent what’s next, discovery, connection, and possibility. We explored several cursor animation behaviors, how it could animate into the wordmark, and how it can interact with language, photos, and illustrations.

Ultimately, the client went in another direction with the logo and the team had to pivot in a new direction. This was still a blast to work on, and some elements from our collaboration made it into the final rebrand.

Discovering what’s next with Marriott Bonvoy.

Logo animation 01

Logo animation 02

Brand list

Logo Animation

Marriott Bonvoy

We developed a comprehensive graphics package for Google's Geo UX Summit, an exclusive in-person gathering for the UX team behind Google Maps. The summit, designed to foster knowledge sharing and collaboration among team members, featured a lineup of engaging talks, insightful presentations, and interactive workshops.

We were tasked with creating a hero loop, speaker interstitials, lower thirds, title cards, GIF overlays, text cards, and archival frame templates for social. We made 2 versions of the toolkit - one in After Effects and the other in Google Slides for on-the-fly edits.

The look and feel of the conference has a lo-fi “glitch” style and we ensured the animation style followed suit. Topography is suggested through simple forms - mountains are lines, landmarks are various shapes, and the Pin icon ties the graphics back to Google Maps. We played with z-space to give these forms a sense of depth, as if they’re floating in an abstract world.

Lo-fi graphics for a high-impact summit.

We are here

Lower third

Speaker interstitial

Geo UX Summit

We were tasked with creating a series of tutorial videos for the Fitbit Ace, a first-of-its-kind smartwatch and fitness tracker made to get kids moving. The device features movement-based games, designed so the more kids move, the further they advance in the game.

The games only work when the user is walking. Great for kids, not for us. We needed to screen record the games in use. The videos required several specific scerarios to showcase - all at different stages of each game. We quickly realized that we actually needed to walk around to get the footage we needed. We plotted several strategies, including hiring an animator to walk around Los Angeles. We ultimately landed on a custom-built rig. We strapped the watch onto this device, which mimicked the movements of a walking person. Our animators were able to “walk” and play the games comfortably while screen recording at their computer.

Working with incredible live action from the Fitbit team, we created kid-friendly tutorial videos that are super easy to understand and capture the playful spirit of the brand. The video was localized in two languages to reach a larger audience, and is featured on all purchase touchpoints and social channels.

Google

Teaching Googlers how to design inclusively.

Client

Project Type

Services

Related Work.

Google Accessibility Apps

Fitbit Ace Game Tutorials

Google Pixel Tips

Coming Soon

Client

Project Type

Services