What I Contributed to the Project

Design user flows and interactions for the web app. Develop a design system with living UI pattern library. Implement UI design in code.

The objective of the project is to produce an app for small business or PYME as they are called in Spain. The challenge is to make the app easy enough for the users to create online ads like banners and can easy launch a campaign and keep track of it. There are tools that exist but too intimidating for the defined users to use in their case, Google Ads Platform. They have the budget and marketing goals but they hesitate to use the existing tools due to its complexity.

Banner Ads Generator UI. The goal of the UI is to show users that the creation are straight-forward and they can always jump back to the steps if they have to modify something.

Campaign Ads Budget Settings. Breaking the campaign in 3 main requirements: budget, campaign period; payment for the allocated budget. An engaging feature has been added for the budget section to simulate the impact of the budget spent to give users an imformed estimate of the reach of the campaign being created.

Campaigns Listing. Since this version of the app has no proper dashboard for insights yet, the design objective is to give the users a quick read out of the recent campaign and its respective details and provide quick actions right here in the listing.

Marketing Website After the MVP app was made, a design system was built along side the front-end implementation of the app. Thus, rolling out the design guideline was done and ensure brand coherence. The art direction is to make it fun, friendly, to depart from the “experts-tool” look and feel like what Google Ads Platform have in their UI.

A rounded sans-serif was chosen and use of irregular organic shape as opposed to the formal boxy look for sections.