Designer & Front-end Developer · Mexico

I design interfaces and build them in code, from scratch.

14+ years as a designer and 7+ years building user interfaces and writing front-end code. I take products from the first Figma frame to production with JavaScript, TypeScript, React and Angular.

See recent work Get in touch

Open to freelance, contract work and full-time offers

FigmaPhotoshopIllustratorInDesignHTMLSCSS / SassJavaScriptTypeScriptReactAngularTailwind CSSBootstrapMaterial UIStyled ComponentsCSS ModulesGSAPVS CodeGitHubShopifyWordPressSlackMicrosoft 365Servers & hosting

About me

Beautiful is not enough. It has to work and be simple.

I studied a Bachelor of Design at ITESO, with a focus on graphic and industrial design. I started in branding and graphic design, moved into web design, and for the last seven years I’ve been designing and developing user interfaces.

Today my focus is design and development. I design in Figma, then build the interface myself with clean, maintainable code and animation libraries, so what gets approved is what ships. Platforms like Shopify and WordPress are a plus when a project needs them.

14+
years in design
7+
years building UIs and writing code
  • UI/UX DesignFigma, wireframes, prototypes, design handoff
  • Front-endJavaScript, TypeScript, React, Angular
  • WorkflowGitHub, VS Code, servers and deployment
  • Visual designAdobe CC, branding, iconography

What I do

Design and code in one person

UI/UX Design

Interfaces for web and mobile based on what users and the business need, from wireframes to high-fidelity prototypes in Figma.

Figma · Prototypes · Handoff

Front-end Development

Sites and interfaces built with semantic HTML, JavaScript, TypeScript, React or Angular, styled with SCSS, Tailwind CSS, Bootstrap, Material UI, Styled Components or CSS Modules.

React · Angular · TypeScript · Tailwind

Interaction & Motion

Scroll effects, transitions and micro-interactions with animation libraries like GSAP, used where they help the story.

GSAP · CSS animation

Web Design

Layouts with a clear hierarchy and a strong visual identity, designed for every screen from the start.

Responsive · Visual design

Branding & Iconography

Brand assets, custom icons and illustration that make an interface easier to understand.

Illustrator · Photoshop

Platforms (as a plus)

When a project needs it, I customize Shopify and WordPress themes and build sections the client can edit.

Shopify · Liquid · WordPress

Process

From brief to launch in six steps

  1. 01

    Discovery

    Purpose, goals, audience and content. We agree on what success looks like.

  2. 02

    Planning

    Site map and structure, based on what we learned.

  3. 03

    Design

    Wireframes first, then mockups for desktop and mobile, reviewed with you.

  4. 04

    Development

    The approved design becomes a working, responsive site, built together with the dev team.

  5. 05

    Testing & launch

    Checks on real devices and browsers before going live.

  6. 06

    Maintenance

    Updates, new content and improvements after launch.

Case studies

How I solve problems

Challenge, process and results for each project. Click one to read it.

Recent work

Live websites

A selection of recent sites I designed and developed. Other current projects are under my employer’s confidentiality.

Earlier work

Previous client websites

Home pages from earlier projects. Full projects are under privacy agreements. Hover a screen to auto-scroll it, or scroll inside it.

Home page of a kids’ clothing store
Home page of a furniture store

Experience

Where I’ve worked

Full details on LinkedIn ↗

  1. 2019 – 2026

    Designer & Front-end Developer

    Oracle

    UI design and front-end development of websites and interfaces, from Figma to production.

  2. 2016 – 2018

    Web Designer & Web Developer

    Thlink Marketing

    Wireframing, web design and development, e-commerce sites and client support.

  3. 2012 – 2016

    Graphic & Lead Designer

    CIMABA Seguros · Maniak Experiencial · Franquicia tu Negocio

    Brand identity, web design, illustration, iconography and campaigns.

Education

Bachelor of Design · ITESO, Universidad Jesuita de Guadalajara

Diplomas

Web Design · Digital Illustration

“Anyone should understand what a design wants to say, without needing an explanation.”

My design principle

Contact

Need a designer who codes? Let’s talk.

I currently have a full-time role, and I’m available for freelance and contract projects. I’m also happy to hear about full-time offers.

contacto@dianabojorquez.me