Back



Xeal



FOUNDING DESIGNER
LOS ANGELES/REMOTE
2019-2023WEBSITE



Xeal is an EV (electric vehicle) charging company that provides a product suite to property management groups by which EV drivers can authenticate payment for a charge within seconds without the internet. I helped the company enter the market, find product market fit, and created design standards and philosophies to help the company scale to having chargers at some of the top properties in the US under agencies such as Lincoln Property Company, Brookfield Property Partners, and many more.



product-market fit

I joined Xeal as the founders’ first employee in 2019 to help start the company’s design presence. The founders envisioned making EV charging more accessible. They began working on a scheduling tool as their first concept, which allowed users to reserve hours to set their cars in company parking lots. I designed the initial iOS app and branding, including “Zeal” and the green brand color, to highlight the company’s passion for an energy-focused market. 

The founders later decided to pivot towards building a solution that would eliminate the need for chargers to be connected to the internet, allowing drivers to use their phone to authorize their payment for their charging session offline, authenticating through an NFC connection, and complete any payment information when their phone was back online. The product’s most significant advantage became a charging experience that would take the driver from plugging the charger into turning the charger on to accurately tracking your payment within a few seconds.





new brand


The first thing we did when pivoting to the new product was to change the company name from having a “Z” to an “X” to represent a revolutionary, futuristic, and bold new brand. In this shift, I crafted and oversaw how design would cross over the mobile app, website, admin dashboard, chargers, and environmental/physical signage.

I guided the founders in a positioning exercise to solidify brand philosophies so that as time went on and new products were introduced, the founding values could always be referenced. Below are some excerpts from the philosophy portion of the brand book I put together.










On the visual side of the rebrand, I pushed the company to lean into the values of ‘futuristic’ and ‘premium.’ I helped direct an external agency’s work on our website, logo, colors, and typeface, resulting in us changing the primary color from green to purple, choosing a sharper and higher quality typeface, and introducing a helix shape to compliment the “X” in the name.

The metaphor I leaned back on was using design to help the driver navigate the “dark parking garage,” as many chargers would be placed in dimly lit areas. This also helped to connect with the reality that being confused about highly technical concepts can also feel like drivers are ‘in the dark,’ especially when complicated terms such as kWh, amps, volts, and levels of charging speed. Some excerpts from the visual side of the brand book are below.






THE HELIX

“To harmonize with the ‘X’ in the name, the helix graphic should be used as a secondary brand element in touchpoints. This helps us represent ourselves as futuristic and revolutionary by visually being reminiscent of DNA, complimenting our warm and friendly copy choices with visuals that indicate sophistication.”


XEAL PURPLE

“Purple should be used as the ‘guiding light’ to help guide drivers through complicated concepts and charging flow within the platform. As a form of non-verbal education, the purple should be used to connect physical and digital touchpoints and help drivers get the fastest charging experience possible even in the dark, metaphorically and literally.

DARK NEUTRAL COLORS
“To represent our premium experience, we default to using dark negative space. This connects to the dark garage metaphor, even in 2D use cases, allowing the purple to shine through and indicate our ‘futuristic’ value. Light backgrounds are used when required by the medium and more sparingly.”






FOCUS RING

“To guide drivers towards areas of interaction, place the focus ring to highlight where they should pay attention to. The ring symbolizes electrons flowing, and as such should be used when communicating handoff between the charger and phone. If possible by the medium, it should be animated to further its impact.”



product


Having a product that crossed between digital and physical touchpoints meant we needed tight consistency design-wise. Through various concept tests, we created an experience that bridged the mobile app and charger using the helix, purple, dark colors, and focus ring. We took these elements into environmental signage for trade shows, the website, investor decks, and printed marketing materials.



CHARGER INTERACTION
Once the charger was authenticated to turn on and start charging, the mobile app carried back the driver’s focus through animations and uses of purple, indicating that the experience should now be monitored on the phone. This is important as crucial details such as ending a charge and payment details are handled on the phone after the charging session.









FOCUS RING

The focus ring was placed precisely where the wireless interaction needed to happen since it required the user to put their phone within a centimeter of this space to work. This helped drivers understand in simple terms where to tap their phone, just like Apple Pay.




PURPLE “GUIDING LIGHT”
Chargers were fitted with Xeal-specific internal hardware to scale to properties fast to help the wireless connection and wrap for the custom branding on top. Using the purple and helix to add branding to the charger made them stand out from the dark gray of a parking garage and other brands. See an example below of how this looked in parking garages:




advising


The company had scaled to over 50 employees and demanded more investment into product advancement and scaling. I worked with the founders to shift my role from part-time designer to an advisor. I helped recruit and interview a Design Lead, transferred knowledge over a year, advised on decisions for new UX design, charger industrial design, marketing materials, and selecting the right agency for further rebrand work. In that year, we saw charging hours increase by 6.8x, the total amount of drivers increase by 3.7x, and the amount of C02 reduction increase by 1.8x.





 
  SCOTT LUTTMANN

PORTFOLIO ©2024