Full Stack Senior Product Designer

From Brand, through Marketing, Product Department, and finally Growth... Below you'll find plenty of areas and solutions I've crafted in different departments and teams across the company:




01 . What is a POS?

The Clover Station POS System is a flexibility solution that allows you to process credit card payments and manage your business effectively. This Point of Sale device can also track inventory, employee time and much more...

"To simplify the lives of business owners so they can focus on doing what they love".


The Clover Station POS System is a flexibility solution that allows you to process credit card payments and manage your business effectively. This Point of Sale device can also track inventory, employee time and much more...

Clover, a Fiserv Company, is the fastest-growing established payments and point-of-sale platform, with more than 1 million devices shipped globally. We improve merchant productivity and growth with secure cloud-based software, deep data analytics, purpose-built hardware, and a broad ecosystem of business management tools designed to customize our platform to meet any merchant need.

02 . Branding Team

2023 Brand Revamp Project: I've been part of the internal Clover Brand Team leading the being a key hands-on designer. During a almost a year and a half, we collaborated with an external design company called Huge Inc. in order to redesign and revamp the Clover brand. Bellow you'll find some of the extensive examples:





Where to curate the brand not only internally, but with collaborators and external agencies  

LINGO:  A digital brand guidelines and asset management brought together into one easy to use and manage platform.
Take a look at the product: View >


Brand Assets into one platform

All components easily reachable at a glance 

All organized in different sections

Internal & external departments can grab all assets

Icon Animation Example



The concept behind animating the iconography is simple: crate a more energetic & playful brand experience.

Secondary Animations



Through the movement applyied on the basic branding elements, generates more engaging experience.

CTA's micro animations

Giving a second hint to a CTA using microanimations was a key decision made with the product team to push clicks. 

Link's micro animations

Same idea was used on the links. Clicks should be highlighted on an ocean of content presented in the website.   

Interactions animated 

Mouseovers and all the actitudes of all the clickables elements were covered on the branding design too.

03. Iconography

A set of branded icons was crafted following the brand style and brand spirit, as part of a huge internal effort. The icon family developed illustrates and complements the wording, the copies, and the entire Clover's tone and voice.     


Secondary icon family for products and devices was also designed:


Marketing

Tech companies gain a creative powerhouse with an art director. They elevate marketing campaigns with stunning visuals and ensure brand consistency across all channels, making your tech product stand out in a crowded marketplace.

Growth

Art directors in a tech company's growth team elevate user experience with a keen eye for design, while guiding creative strategy to fuel user acquisition and brand awareness. In short, they marry artistic vision with strategic growth goals.

Branding

Clover tells its story through impactful visuals. A visual designer on the brand team translates complex ideas into clear, engaging imagery, breathing life into the brand and capturing user attention.

05 . Ebooks

The art and craft of creating visually appealing and user-friendly digital books that includes:
• Interactive elements: Some ebooks incorporate interactive features like quizzes, audio clips, or embedded web content, enriching the reading experience.
• Branding and style: Design should align with the author's brand or the publisher's style guide for consistent visual identity.
• Target audience: Understanding the reader demographics and preferences informs design choices like font size, color palette, and visual tone..

06 . Illustrations

Branded illustrations can be a valuable asset for a tech product website. By enhancing visual appeal, improving user experience, and boosting SEO and marketing efforts, they can contribute to a more successful and memorable online presence.

And also they have multiple applications: Illustrations can be used across various marketing materials, from websites to social media and print ads, and they can also be easily adapted to different sizes and formats.

Interface animated proposal

By collaborating with product desig department at Clover, I created different illustrations that played a key part building more engaging interfaces.  

Mobile versions

In order to create coherent designs, I followed the brand guidelines and some product design to create banners and online promotional assets.  

07 . The Social Networks Game

I was in charge of all the artifacts (visually speaking) delivered by the social network team:
• Animations: Some of the stories and posts required fun and easy animations.
• Retouching: Plenty of deliverables where made just by a quick photographic retouch.
• Creativity: I worked alongside the team injecting creativity to all of the stories.

www.instagram.com/clovercommerce

08 . Packaging

Helping to Improve the Purchase Experience

Design proccess: A couple of approaches were needed to tackle the main idea: Blooming. The booming of a clover plant and petals. 


Graphic Design, 3D and Amination proposal.
The way the box opens and the pieces of the packaging reinforce the brand and its morphology.




Final Unboxing.
A couple of images showing the concept and solution for the first customer's product experience: the packaging.


09 . Promotional Videos

The Kitchen



On the Road



Acclaim & Press

During 2022 and 2023 CLover has received plenty of awars on the media as the resulting campaign created by ClosedLoop Adgengy. https://www.closedloop.com

logo

2023 Telly Award winner 
Online Commercials: 30 spot "Kitchen"
• Online Commercials General – Branding.
• People’s Telly General – Online Commercials.
TELLYAWARDS.COM


logo

2023 Telly Award winner 
Online Commercials: 30 spot "Kitchen"
• Online Commercials General – Financial Services.
• Online Commercials Craft – Motion Graphs/Design.
TELLYAWARDS.COM



logo

2023 Telly Award winne 
Online Commercials: 30 spot "Kitchen"
• Online Commercials Craft – Videography/Cinematography. 
• Online Commercials General B2B. 
TELLYAWARDS.COM


logo

2023 AdAge Small Agency Awards
Closed Loop Wins Silver
• ‘On the Road’ for Clover is Small Agency
B2B Campaign of the Year.
ADAGENCY.COM


10. Credit Card Design

The visual design of a credit card is a nuanced combination of aesthetic appeal, functionality, and security features.

11. Email System

Promoting Mini Clover

A system of modules were created in order to play with the content in many different purposes

Empowering the Merchant

This email example is one of a bigger set of communications sent to Clover's merchants

Chat GPT

As part of improvements in customer service, Clover implemented a communication channel based on artificial intelligence.
This is an example of the Chatbot that was implemented in 2023.

12 . Gift Cards: Purchasing Experience

As part of the purchasing process, there's a nice tool: The Gift Card. It was implementing with great success.

13 . Architecture Design

One of my biggest efforts at Clover, was to clean up and to reorganize the entire site. All the vertical, sections, navigation, tools, areas, and pages; were totally reorganized as aprt of a major projects at the company.

SITE MAP reorganized all the structure and the architectural information


RESULTING REDESIGN:
Plenty of pages were blended with other, many other were deleted, and all the navigation and all the page's nomenclature, were redefined with one big goal: the user should find the content easily and with less clicks.

14 . Headquearter's Office in Manhattan

I was in charge of the Clover's front office design in New York

Number One, Broadway Steet - Google maps screenshot.


RESULTING REDESIGN:
The basic concept was to not introduce too much noise into the architectural environment, while subtly highlighting the entrance to Clover's offices.

15 . Marketing

Development of all ads, banners and promotional online advertisments:
Plenty of campaigns were created and art directed by me during the time I worked with Marketing's team at Clover.
I closely collaborated with Closedloop.com on most of the video campaigns.

Animated GIFs



Promoting Flex Device: Movement is inherently eye-catching. Compared to static banners, GIFs can grab a user's attention more readily.



Duo Station promotional Ad: A short animation can convey a message or product demonstration more effectively than static text alone.



Microanimations: Compared to more complex video ads, GIFs can be easier and faster to create, especially with user-friendly online tools.

Motion Graphics

16 . Blog Redesign

Increased Brand Awareness and Thought Leadership:
Establish expertise: Regularly publishing informative and valuable content positions your company as a thought leader in the tech industry. Attract new audiences: A blog helps you reach a wider audience who are interested in the topics you cover, potentially converting them into customers.


Post Page

A POST
A blog post is an informational article or entry published on a blog, which is a website consisting of regularly updated content.


Section Page

NAVIGATION
system that guides users to explore different sections and content within the blog. It plays a crucial role in user experience, making it easy for readers to find what they're looking for and encouraging them to navigate deeper into the blog.

Blog on Mobile

85% of Clover users check the blog on their phones. Here's an example of how the blog is previewed:

17 . App Store

All assets and promotional visuals used in the Apple and Android store, were crafted by me during my consultancy at Clover:


The Role

I collaborated as the Senior Full Stack Designer working as part of the design team overseeing customer acquisition, including the Clover brand (Brand Guidelines and its application), the clover.com website shopping experience, cross-channel communications, packaging, and marketing collaterals. I partnered with Marketing and Design leadership to introduce integrated hardware and software products to small business merchants in North America and Latin American markets.

I've added Strategic Design Leadership by:
• Vision and direction: Provides strategic guidance and mentorship to the design team, aligning design efforts with the company's overall vision and business goals.
• Elevating design quality: Sets high standards for design excellence, driving innovation and pushing the boundaries of what's possible.
• Building design culture: Fosters a strong and vibrant design culture within the team, promoting collaboration, communication, and continuous learning.
• Solving complex design challenges: Tackles intricate design problems with proven methodologies and creative solutions, ensuring user-centricity and business impact.

The Numbers

Clover processed $133 billion of annualized card transactions worldwide in 2020, making it the largest U.S. cloud POS firm.

Some conclusions

Imagine a tech company where design isn't siloed, but a bridge connecting every stage of product development. That's the magic of having a full stack product designer on board. They're the ultimate design chameleons, fluent in the languages of engineers, marketers, and user experience specialists. This superpower translates to some serious benefits for your tech company. With a full-stack designer, communication becomes a breeze. They can speak the technical jargon with engineers, translating design ideas into actionable plans. They can brainstorm marketing strategies with a designer's eye for user experience, ensuring your product resonates. It's like having a built-in translator who ensures everyone's on the same page, fostering a collaborative environment where design isn't an afterthought, but a driving force for innovation.

Full stack product designers are tech company chameleons, bridging the gap between engineers, marketers, and UX specialists. They speak the language of every team, ensuring design is a driving force, not an afterthought.

Clover.com

Clover.com is a company that provides point-of-sale (POS) systems and payment processing solutions for small and medium-sized businesses (SMBs). They offer a range of hardware and software solutions to help businesses manage their sales, inventory, employees, and customer relationships.

Role + Location

Full Stack Senior Product Designer
San Francisco / New York

Skills

 

Previous Case Study / Next Case Study