TypographyBrandUX/UI

Type design · Art Direction · Design Consultant

I never specialised, and it’s a choice. Interfaces, brands, typefaces and still learning.

Twelve years spent widening the perimeter instead of narrowing it. SaaS platforms and apps used on the road, technical e-commerce, brand identities from the name to the packaging, typefaces both commissioned and commercially released. Every new field makes the ones I already knew more solid: someone who has drawn a typeface understands a design system before seeing one, and someone who has built a brand knows why a purchase path has to be written before it is designed.

This profile is what you want when the problem hasn’t been defined yet: creative direction and consulting, the craft of holding different specialists together and speaking everyone’s language — designers, developers, client. Right now I’m adding information security and red teaming of AI systems, because that is where the risk in digital products is moving.

A project is a system, not an artefact.

I spent years drawing typefaces. It’s work that teaches one thing, repeated thousands of times: every element exists in relation to all the others, and consistency is built up front, in the rules, not afterwards, in the fixes.

Applied to an interface, that means starting from the flow and the states — what happens when the field is empty, when the connection drops, when there is too much data — and arriving at the screen as a consequence. Applied to a brand, it means handing over rules that outlive whoever applies them after me.

The rest is listening: to the client, to the stakeholders, to whoever will actually use the thing. I’ve worked with teams in Italy, the United States, the United Kingdom and India, and the hard part was never the software.

Direction and consulting
Creative direction, coordinating designers, client management, presenting to stakeholders, defining method and process
Product & UX
User flows, information architecture, wireframing, prototyping, interaction design, SaaS, mobile apps
UI & Design Systems
Design systems, component libraries, style guides, design tokens, responsive, Material Design, data visualization, handoff
Brand & Typography
Brand identity, brand books, packaging, art direction, type design, typeface development, lettering, editorial, illustration
Tools
Figma, Adobe CC, Glyphs, After Effects, HTML/CSS, JavaScript, Python
In progress
Information security, red teaming of AI systems

UX / UI

A web app for company management and sales negotiations, designed to use AI to streamline prospect onboarding — with a companion app built for people working in the field.

The problem

A CRM has to show a lot of data without becoming unreadable. The problem ran two ways: making the state of dozens of parallel deals legible at a glance, and cutting data entry down to seconds for someone moving between clients.

What I designed

  • A stage view in columns — opportunity created, contact made, presentation, offer sent, won, lost — with per-state counters, total value at the foot of each column and bulk actions: move stage, freeze, archive.
  • An alternative list view over the same data, sortable by title, company, owner, deadline, stage and value: two ways of reading the same work, for two ways of working.
  • A side detail panel with actions grouped by intent — report, schedule, communicate — so the task closes without leaving the pipeline.
  • Trovaclienti: AI segments prospects by spend bracket and offers them for purchase, with summary metrics, comparison against known companies and a history of packages already bought.
  • A mobile app built on a newsfeed interaction model: voice memos, one-tap meeting outcomes, contacts on a map. Handed to the team for React Native development.
  • A documented design system: eight semantic accents and eight grey steps, complete form field states, a hierarchy of primary, secondary and destructive buttons — with the CSS specifications already written for developers.
Anima
Stage view: each column is a step in the deal, with per-state counters and total value at the foot.
Anima
Detail panel with actions split by intent: report, schedule, communicate.
Anima
List view: the same data as a sortable table, for people working to deadlines rather than stages.
Anima
Trovaclienti: prospects segmented by spend bracket, with summary metrics and purchase history.
Anima
Documented form elements: default, focus, error and disabled states, with the CSS specs alongside.
Anima
Button hierarchy: primary, secondary, destructive and disabled, each with its own code.
Anima
Palette: eight semantic accents and eight grey steps, with RGB and hex values.
Anima
Shadows, borders, link states and charts: the last building blocks of the system.

A deliberately lightweight app for selling in the field, built around a cycle that closes every twenty-eight days: a list arrives, you work it, you measure what worked.

The problem

Nobody fills in a CRM from the driver’s seat. The job was to reduce every interaction to a single gesture and give something immediately useful back: where the contacts are, how the month is going. It also needed somewhere to put the people who don’t answer first time, who in the field are the majority.

What I designed

  • The twenty-eight day cycle as the load-bearing structure: a new list announces how many contacts it holds and how much time is left, and from there every screen carries the days remaining.
  • Contact list with colour-coded status — new, contacted, engaged, closed — distance from your current position and a contextual action on the card, switchable to map from the same control at the top.
  • Contact record cut down to what you need at the door: phone, address, supply point and price list, with call and navigation as the only primary actions.
  • A feedback loop in a single screen: one question, a face that changes with the answer, four levels, and always a declared way out — call didn’t connect, nobody home.
  • Recovery for the missed contact: if it was the wrong moment you reschedule with date and time in two taps, otherwise you declare it lost. Recoveries land in a list of their own.
  • Personal performance dashboard: status distribution as a donut chart, redemption rate and won/lost ratio on a continuous bar, with an acknowledgement at the end of the month.
  • Product identity: logo, palette and a type scale built on Quicksand, documented in a style guide.
DealNow
A new list opens the cycle: how many contacts it holds, how many days are left to work them.
DealNow
All contacts with colour-coded status, distance from where you are and a contextual action at the foot of the card.
DealNow
The same list as a map: the pins repeat the status colour, with no legend to learn.
DealNow
Contact record cut down to what you need at the door, with call and navigation as the only primary actions.
DealNow
Feedback after a call: one question, a face that changes with the answer, and a declared way out.
DealNow
The same pattern after a face-to-face meeting. Four levels, one send, nothing else.
DealNow
If it was the wrong moment: reschedule with date and time in two taps, or declare the contact lost.
DealNow
Reminders carry the right action with them: call if they came from a call, navigate if they came from an appointment.
DealNow
Recoveries live in their own list, kept apart from new contacts so two ways of working don’t mix.
DealNow
Personal performance: status distribution, redemption rate and won/lost ratio.
DealNow
The end-of-month acknowledgement, the system’s one explicit reward.

An app for the tyre trade, where gamification exists to support dealer sales and hold a community together.

The problem

Tyres are a purchase people postpone until it becomes urgent. The idea was to give the driver a reason to open the app before that moment, and the dealer a reason to get them through the door.

What I designed

  • Only three sections in the top bar — treasure hunt, garage, tire test — because an app opened twice a year cannot ask anyone to learn a navigation.
  • A Garage section: the user’s car and fitted tyres, with wear as a percentage and a traffic-light colour that flags replacement before it becomes a problem.
  • Tire test: photographic tread scanning, with the wheel framed inside a guide circle, to estimate wear and compare the tyres currently fitted.
  • A treasure-hunt mechanic on promotions — find the complete series to unlock the discount — turning app usage into footfall at the point of sale.
  • High-contrast yellow and black direction, condensed italic type, chequered flag and dashed rules: motorsport language, not e-commerce.
Fintyre
Garage: the user’s vehicle, the tyres fitted and wear as a percentage with a traffic light beside it — 89% green at the front, 5% red at the rear.
Fintyre
The treasure-hunt promotion: the discount unlocks by finding the whole series, with the latest finds listed underneath.
Fintyre
The search in progress, drawn as a concentric radar rather than a loading bar.
Fintyre
Tread scanning: the wheel is framed inside the guide circle, and the scan line confirms it is reading.
Fintyre
Tire test cut down to two roads only: compare your tyres, or estimate the wear.

An online catalogue of circular saw blades, router cutters, drill bits and knives for working wood, plastic and aluminium. Hundreds of codes, each with a spec sheet that decides the purchase.

The problem

Someone buying a blade isn’t looking for a product: they’re looking for the right blade for the material they have to cut and the machine sitting in their workshop. A catalogue organised by category doesn’t answer that question. It had to be turned around and start from the job to be done.

What I designed

  • Filters built on the real problem rather than on the warehouse taxonomy: you start from fourteen materials to be cut — soft and hard wood, plywood, chipboard, veneered, laminate, MDF, plexiglass, aluminium, ferrous and non-ferrous metal — then narrow with sliders on blade diameter, bore diameter and thickness.
  • Technical specs brought onto the list card instead of hidden in the product page: diameter, bore, tooth count and thickness, each with its own icon and its minimum and maximum values. They are read while comparing, which is when they matter.
  • Search with a scope selector beside the field: anyone arriving with a code in mind looks it up straight away, anyone without one stays on the category path.
  • The wishlist works as a quotation request: codes accumulate and are sent in one go. Technical B2B doesn’t end in a payment, it ends in an offer, and the site walks the buyer to that point.
  • A three-level taxonomy across six families — blades, knives, drill bits, router cutters, accessories, sharpening — navigable from the menu, the category grid and the breadcrumb, because a technical catalogue is entered from every side.
  • Editorial pages on the subjects that justify the price: Frozen treatment, hard metal, blade characteristics. In a technical market the explanation is part of the product.
  • Dark ground with a blue accent: the steel of these products is grey, and on white it disappears. Italian and English across the whole catalogue, product codes included.
International Saws
Home: search with a category selector at the top, the six-family menu always on the left, and the three technical pages explaining why a tool costs what it costs.
International Saws
The six families with their subcategories already visible: anyone who knows the trade skips a level of navigation.
International Saws
Product carousel with families as tabs. Every card carries the measurements in plain sight, not just a photograph.
International Saws
On mobile the header shrinks to language, phone, search and menu: four controls, because a thumb reaches four.
International Saws
The carousel keeps its tabs in portrait too, with one card at a time filling the screen.
International Saws
Product list: breadcrumb, filters with a counter of the active ones, and on the card diameter, bore, teeth, thickness and compatible materials.
International Saws
The full-screen filter panel: fourteen materials to be cut, then the dimension sliders. You start from the job, not from the code.
International Saws
The wishlist isn’t a cart: it collects the codes and sends them as a quotation request, which in technical B2B is the real act of buying.

A Sicilian coach company running since 1926: more than a hundred and ninety buses, over three and a half million passengers a year. The site has to sell a ticket and at the same time carry the obligations of a public service.

The problem

Three different audiences on one homepage: the tourist booking a long route, the commuter renewing a season pass, someone after an urban ticket worth a couple of euros. Each is in a hurry in a different way, and none of the three should trip over the other two.

What I designed

  • A trip search engine on the first screen, laid over the image rather than pushed below it: origin, destination, outbound, return and passengers. The swap button between the two places saves retyping everything when looking for the way back.
  • The return is a dashed, optional field and the outbound date arrives pre-filled with today: the shortest path is pressed first, the others stay one tap away.
  • Urban tickets have a colour of their own, green, and sit outside the route search box. Two different products living on the same screen without being confused for each other.
  • Season passes on a tab beside tickets: they need the travel card and therefore registration, and the constraint is stated at the exact point where it blocks, not two screens later.
  • On mobile a Buy bar stays anchored at the foot of the whole page: you can read the company history, the routes, the FAQ, without ever losing sight of why you came.
  • Service promises spelled out before the purchase — digital ticket, contactless on board, booking changeable up to departure, Wi-Fi and sockets, 1+1 luggage — with the FAQ picking up whatever objections remain.
  • The network navigable by city as well as by route, with cards that speak about the place before the timetable, and public service obligations — service charter, conditions of carriage, complaints, accessibility — built in without weighing down the purchase path.
SAIS Autolinee
The trip search sits over the image, not under it: origin, destination, dates, passengers. And urban tickets, in green, stay outside the red box.
SAIS Autolinee
Routes told starting from the city: Ballarò, the Vucciria, Etna. Anyone choosing a destination isn’t choosing a timetable.
SAIS Autolinee
Ten million kilometres a year, a hundred and ninety buses, three million seven hundred thousand passengers, a hundred years of service: trust stated in figures.
SAIS Autolinee
Frequently asked questions as an accordion on a dark ground, right before the partners: the last objections cleared before leaving the page.
SAIS Autolinee
On mobile the search form becomes the first thing under the image, with stacked fields and the swap button between origin and destination.
SAIS Autolinee
The menu carries search, language, phone, email and social with it: everything needed by someone who is stuck and wants to talk to a person.
SAIS Autolinee
Service promises as cards: digital ticket, contactless on board, changeable booking, Wi-Fi, luggage. Below, the Buy bar stays anchored.
SAIS Autolinee
The cities in portrait, one card at a time, with the purchase bar always within thumb reach.
SAIS Autolinee
Even at the foot of the FAQ the purchase stays anchored: you can read everything without ever losing the reason you came.