Contact
Illustration de la compétence UI Design & UX Design - Jose DA COSTA
Technical skillSoftware Development

UI Design & UX Design

Acquired at Master ESIEA. Kept out of the Fullstack pillar so it can be mentioned independently in product storytelling. Reason about UX upstream of the code: wireframes, journeys, and information architecture before the first React component.

Personal Confidence
Advanced4/5
FoundationalDevelopingProficientAdvancedExpert
How this competency evolved over time

Each segment is a period (journey or achievement) where the competency was applied. The colour and size of the end dot reflect the level reached during that period.

Foundational (1/5)
Developing (2/5)
Proficient (3/5)
Advanced (4/5)
Expert (5/5)

My definition

UI design and UX design, in my practice, is the upstream discipline of reasoning about user journeys, wireframes, and information architecture before the first React component. It is the competency that lets a CTO push back on a poorly framed brief, produce a readable wireframe before code, and decide when a design is shipped enough to deliver.

I run this competency on 2 distinct phases. Discovery: user interviews, journey mapping, paper then lightweight Figma wireframes validated in under 30 minutes by the responsible business owner. Production: minimal UI kit, design tokens, WCAG accessibility, ownership of front-end implementation. Foundations acquired at the Master ESIEA (UX, user journeys, information architecture), kept sharp through every successive product role from Pichet (internal-tooling wireframes, 80 interlocutors adopting the tools with minimal training) through Magento Enterprise storefronts (3 cohesive responsive themes) to the solo accounting SaaS (6-role experience framed upstream).

In 2026, generative AI has crossed onto UI: the reference tool is v0 by Vercel, which turns a description into production-ready React components with shadcn/ui + Tailwind, database integrations, and deployment, claiming more than 6 million developers on the platform. Vercel details how to pair it with an existing design system in AI-powered prototyping with design systems. The cost of producing screens collapses, but journey, information architecture, and accessibility decisions remain human, and that is exactly where design value plays out in 2026.

My evidence

Achievement

Anecdote 1 : Wireframing the ESB internal tooling for the business directions

On the Pichet ESB scope, I had to equip roughly 80 daily interlocutors coming from 12 business directions (Finance, Accounting, HR, Marketing, Hospitality, Real Estate, Security, IT, etc.). These people were not technical users: they needed integration dashboards, flow visualisers, clear reporting tools - but with no deep technical training and a cognitive load already saturated by their day job.

I refused to dive directly into Symfony code. Before every screen, I produced a paper wireframe then a lightweight Figma version that I had validated in 30 minutes by the responsible department head, asking 3 questions: what are we trying to do (user intent), in what order (the journey), with what vocabulary (business language, not tech). Once the wireframe was approved, I moved on to the Symfony controllers and the Twig + jQuery integration, but the journey was locked. For the most sensitive financial flows, I also produced journey maps documented on Confluence.

Roughly 80 interlocutors adopted the tools with minimal training, average training time dropped from half a day to less than an hour, and the business directions later came back to the ESB team to scope 3 additional cross-functional tools without going through another evangelisation phase.

On this project I durably understood that a readable wireframe is worth 3 iterations of code. It is the reflex I now replay on every ACCENSEO engagement and on the accounting SaaS: sketch before opening Figma, validate the journey before the first line of React, and accept that a blank A4 sheet and 10 minutes are often worth more than 2 hours in Figma.

Achievement

Anecdote 2 : Designing 3 coherent responsive storefronts for Fleurance Nature

On the Fleurance Nature refit in 2017 at Smile, I had to redesign 3 storefronts (Fleurance Nature France, International, Mincifine) with a shared brand identity but different local codes. The graphic specifications went through 7 versions in 2 months as business edge cases surfaced (customer groups, multi-site promotions, category translations, review handling). On responsive, I had to hold mobile + tablet + desktop without multiplying themes.

I laid down a shared responsive grid (mobile-first, breakpoints calibrated against existing analytics) and a minimal UI kit that factored the critical visual components (categories, product sheets, checkout funnel, navigation). For every storefront, I produced responsive wireframes across 3 breakpoints, validated visual mock-ups iteratively with the customer, wrote the graphic specifications for the 3 distinct themes, and then owned the front-end implementation on Magento. The WordPress blog plugged in via RSS was aligned visually on the same grid.

3 coherent storefronts shipped to production across 8 environments, shared visual identity preserved without per-store rewrites, and the 58-day post-launch warranty handled in person without any major UX incident.

That UI/UX discipline is what now lets me push back on a poorly framed brief at ACCENSEO without depending on an external design agency. On the solo accounting SaaS I replayed the same mechanic to frame the experience for 6 distinct roles (Admin, Collaborator, Consultant, Accountant, Accounting, Banking) before the first line of code - and that is exactly what saved me the post-delivery iteration weeks that an unframed scope would have cost.

My self-critique

Level Confirmed. Foundations acquired at the Master ESIEA (UX, user journeys, information architecture), maintained by every successive product role: ESB tooling wireframes (≈80 interlocutors adopting the tools with minimal training), 3 cohesive responsive themes on Magento Enterprise, 6-role experience framed upstream on the accounting SaaS. Capacity to write a journey map, sketch a readable wireframe, and challenge a brief. What still needs strengthening: token-based design system at scale and WCAG 2.2 AAA accessibility.

Differentiator for a B2B SaaS scale-up CTO. Without it, the CTO is confined to the tech layer and delegates the entire product layer, which moves the role away from the board and the customers. It is what lets me push back on a poorly framed brief, produce a readable wireframe before the first React component, and decide *when a design is complete enough to ship*.

My advice

*Sketch on paper before opening Figma* - a blank A4 and 10 minutes are often worth more than 2 hours in Figma. To others:

  • never skip the discovery phase (interviews + journey map), even when the brief looks clear
  • invest in a token-based design system from the second screen of a product
  • test accessibility before visual polish - a beautiful but inaccessible site excludes at least 15% of users

My evolution in this skill

UI/UX is what makes my CTO decisions credible product-side. In the 24-month plan, it lets me drive a product framing without depending solely on a PM, defend a design system in front of the board as a scalable investment, and challenge an external design agency on a precise brief. Without it, the role is confined to the technical layer and loses the product lever.

By end of 2027, the observable goal is threefold: ship for the next SaaS line a tokenized design system (Figma + Tokens Studio), pass a WCAG 2.2 AA accessibility audit without major non-conformity, and run an autonomous user discovery workshop. The Confirmed-to-Senior shift is measured on these three deliverables.

Daily design reviews with ACCENSEO alternants in reverse mentoring (they master Figma faster, I bring the information-architecture depth). Participation in internal design system workshops. Master in Software Engineering active.

Possible accessibility deep-dive (WCAG 2.2, advanced ARIA) planned 2026. Maven Design Systems program (Brad Frost or equivalent) targeted 2027 to formalize token practice. Possible ADA certification if the target role touches the public sector.

Weekly intake: Nielsen Norman Group, Design Lobster, Dan Mall. Anchor reads: *Atomic Design* (Brad Frost), *Refactoring UI* (Adam Wathan), *Don't Make Me Think* (Krug). Monthly study of a publicly referenced design system, Material 3, Polaris, GOV.UK.

Circular navigation