X, the Moonshot Factory

X Website

Building X's new website alongside the agency Instrument. 

CLIENT

X, in house

AGENCY 

In house, Instrument

ROLE

Photographer, Web Designer

DATE

NOVEMBER 2019

OVERVIEW

X, formerly known as Google X, is Google's innovation incubator. Widely publicized projects such as the Self Driving Car project (now Waymo), Google Glass, Loon (Internet balloons), and Wing (delivery drones) were started and developed at X. X Projects would start in response to a huge problem, like rural internet access, that was too big of a problem for ordinary startups to tackle, but could be addressed with long term technological investments that Google could finance and support with its infrastructure and talent pool. The chance to work on cutting edge technology that was attempting to solve real problems helped X attract brilliant researchers and scientists to its projects.


I joined X in 2017, working in the product marketing and development department. Our role in the company was to help the projects with all their marketing strategy and design needs as they turned into companies. I worked alongside two other designers- Rowan Ogden and Wendie Ing, and together we designed all the brands and websites of all the X projects. My role was focused primarily on web design and photography, with some branding as well.

 
The existing X website was very small- it was a simple three page website that gave minimal information about what X was, what the projects were, and recruiting was still handled through Google. There had been no focus on public facing content, with no pipeline or team focused on developing content. As a three person design team and a few project managers, we needed external help from an agency to expedite the process of building a site, and to get buy-in for the project from internal leadership.

X_oldsite
X's old website, designed in 2015, was a minimal site that served as a blog post repository with limited information about its projects.
WEBSITE NEEDS
  • Explaining X projects; give current employees an easier way to explain their jobs
  • Recruiting tool; greenhouse integration and marketing around X culture and projects
  • Hub to house press articles and public releases
  • Clear website hierarchy
  • Technological achievements and communicating X’s mission
DESIGN + POSITIONING INSPIRATION

After months of figuring out how to tell X's story and translating it to a physical space with the Xplex project, it was the perfect time to start work on the new website. To help greenlight the project and start thinking of how we wanted the website to be, I did research on other similar organizations (future forward tech that was humanistic) and their websites for reference. It was important for X to portray itself as technologically cutting edge, yet different from other startups in that it was an incubator for large scale ideas that were rooted in the real world, not just software. It also needed to capture X's special energy, where "mad scientist" innovation and the sense of safety (failing fast to find best solutions) was encouraged.

SITE MAP / ORGANIZATION

We used the needs that were outlined to create a rough site map for how we wanted to organize the website. The home page was meant to be a high level overview of what X was, with snippets of news/history/project information. Project pages were separated by each project, with options to sort through by project status (past/present). A “life at X” page was where we could house our recruiting specific needs, and a press/news page could collect relevant articles that X/projects were featured in.

X_Sitemap
wing_collect
CONSOLIDATING ASSETS

After deciding which projects and sections to show on the X website, I collected and organized photos that I had taken, and hunted down older photographs from project teams. I organized the selected assets in folders to share with Instrument and across our internal team, and we made a plan of what assets we still needed to create.

X HOME PAGE

As X was increasingly in the news because of Waymo's graduation and Loon and Wing's imminent graduations, X needed to establish more of an online presence that actually explained what X was. Recruiting top talent was also a priority, while many of the active projects were still secret, potential hires wanted to know what the company had done before and how it operated. The website was also an impetus to systemize all the disparate projects at X- it created a useful template as to how to think about projects and how they related to each other.

x_home_stories
X IS DEFINED BY ITS PROJECTS

There was an incredible diversity of projects at X, spanning from internet balloons, to fuel derived from seawater, to molten salt as energy storage, to delivery drones. Not all projects started at X, or ended at X, but many had developed under X’s framework for determining a project’s worth; whether or not the technology was feasable and profitable at scale, and if it was solving one of the major problems X had defined: food supply, clean energy, connectivity, health, logistics, or mobility.

 
For the project page, we did research and compiled information and artifacts from projects that sometimes had been defunct for years, as well as ones that were currently active and were very sensitive about what kind of information would be conveyed about them. Working with our team’s product marketing managers and project’s managers, we formed case studies on each project.

projects_desktop
waymo_top
wing_top
waymo_slideshow
wing_slideshow
wing_slideshow-1
Waymo_slideshow-1
TECH DETAIL

Every project page featured line drawings of the hardware components. To make these assets, we gathered CAD drawings from each project's industrial designers and drew over them in illustrator. The art direction was inspired by technical drawings and blueprints, we wanted to replicate the feeling of schematics in a style that could be applied across all projects, yet be replicated by others on our design team.

WAYMOtechdetail
Tech-Detail-Makani@1x
wing_techdetail
NEWS AND BLOG 
newstop_big-1
news_highlight
videoplayer
MOTIVATING PEOPLE WITH BIG PROBLEMS

The audience that the X website had to reach most was potential hires. The problems X set out to solve are important and relevant- but we had run into the problem before of people only associating X with shiny technology that was celebrated only for it’s own technological achievement, not for the underlying problem it had set out to solve. Projects that were not yet public (but fell under these categories) could be alluded to because they were grouped in with overarching problem areas.

LifeAtX@1x
PEOPLE AT X

I took photos of featured employees that was used on the recruitment page. It was important to show a diverse array of roles and types of people as they were performing their roles. Because the employees were not professional models (and many were camera-shy) and I wanted to avoid stiff, awkward poses, I took photos of people in situ as they were working and semi-distracted.

LifeAtX@1×2

Featured Work

Product DesignProject type

GoogleDesign

Google Meet HardwareProject type

X DesignProject type

Music PhotographyPhotography

Contact

Email: juuliawang (at) gmail.com
Linkedin

© Julia Wang 2021