Juan Pablo Riano

• Designed and delivered 10+ client-facing marketing websites in Figma - from wireframe to high-fidelity mockup - ensuring visual consistency, clear information hierarchy, and conversion-focused layout.
• Implemented responsive UI in React/Gatsby (HTML5, CSS, Tailwind), translating Figma designs into production-ready code with pixel-accurate fidelity across breakpoints - no handoff friction.
• Created and maintained multilingual content (EN/FR/ES) with attention to brand voice, visual hierarchy, and UX clarity - improving user journeys and time-on-page.
• Built reusable Figma component libraries and UI patterns, streamlining design-to-development handoff and reducing revision cycles.
• Applied SEO-friendly semantic structure and WCAG 2.1 accessibility considerations to all web deliverables, supporting organic visibility and inclusive design.
• Coordinated design reviews and stakeholder approvals, managing timelines and release checklists for smooth, on-schedule launches.

Skills: Figma · UI/UX Design · Visual Design · Responsive Design · GatsbyJS · React · HTML5 · CSS3 · Tailwind CSS · JavaScript · Design Systems · Design Handoff · SEO · Google Analytics

• Designed and delivered 25+ bilingual (EN/FR) responsive UI pages aligned with Figma specifications, brand guidelines, and visual design system standards.
• Translated Figma mockups into pixel-accurate, responsive HTML/CSS, maintaining visual consistency across breakpoints, devices, and sub-brands.
• Applied WCAG 2.1 accessibility standards throughout UI implementation, improving inclusivity and resolving usability defects across the experience.
• Established reusable component patterns and frontend standards, enabling consistent design delivery and reducing rework across the team.
• Collaborated with product and design stakeholders in an Agile environment, attending reviews and adapting deliverables based on feedback cycles.

Skills: Figma · UI/UX Design · Responsive Design · HTML5 · CSS3 · SASS · WCAG 2.1 · Accessibility · Design Systems · Component Libraries · JavaScript · GitHub · Jira · Confluence

• Designed and delivered UI features for a SaaS product, working within a 20-person cross-functional team (designers, frontend, backend) to maintain consistent visual patterns across independently delivered modules.
• Built and maintained a reusable React component library (Tailwind CSS) to enforce UI consistency and accelerate design-to-development handoff across surfaces.
• Validated responsiveness, accessibility, and cross-browser behavior across all UI deliverables, ensuring a consistent experience on web and mobile.
• Collaborated with designers to interpret Figma specs and translate interaction patterns into maintainable, scalable UI code aligned with product goals.

Skills: Figma · React.js · Next.js · Tailwind CSS · UI/UX Design · Component Libraries · Responsive Design · Accessibility · TypeScript · GitHub · Jira · Confluence

• Implemented visual UI refinements and resolved front-end defects across React-based fintech interfaces, improving consistency and polish across user-facing screens.
• Collaborated with UX designers and engineering partners to translate design intent into maintainable, reusable UI components and views.
• Extended UI coverage to React Native mobile surfaces, ensuring a consistent visual experience across web and mobile platforms.
• Instrumented Heap analytics to support data-informed UI decisions, connecting design choices to product usage metrics.

Skills: React · React Native · UI/UX Design · Visual Design · TypeScript · HTML5 · Bootstrap · Node.js · Heap Analytics · Cross-functional Collaboration

• Built modular, component-driven React/Next.js UI to demonstrate AI-based detection workflows, focusing on clear interaction patterns and consistent visual design across stakeholders.
• Maintained and extended a legacy AngularJS interface, integrating new UI components while preserving visual consistency and interaction standards.
• Collaborated with clients and internal teams to validate UX across platforms and ensure deliverables matched design expectations.

Skills: UI Design · React.js · Next.js · TypeScript · SASS · Responsive Design · Component Libraries · Cross-functional Collaboration · AngularJS

• Built responsive, mobile-first UI layouts for a high-traffic gaming platform, ensuring visual consistency and usability across devices and browsers.
• Converted design documents into hand-coded HTML/SASS with high fidelity, maintaining pixel-accurate alignment with design specifications.
• Implemented responsive grid systems and UI components using Bootstrap 4, supporting a consistent visual experience at scale.

Skills: UI Design · Responsive Design · HTML5 · CSS3 · SASS · Bootstrap · Vue.js · Magnolia CMS · Mobile-First Design

• Built dynamic, responsive UI pages in HTML5/SASS/TypeScript/Angular, collaborating with a cross-functional Agile team to improve user experience for a medical imaging platform.
• Refactored SASS component architecture to establish consistent spacing, typography, and reusable UI helpers across the application.
• Documented UI components and contributed to design standards, ensuring consistent patterns across the interface.

Skills: UI Design · HTML5 · CSS3 · SASS · Angular · TypeScript · Responsive Design · Agile · Scrum · GitHub

• Partnered with design and engineering teams to build intuitive UI views and reusable components for a financial services application, with emphasis on visual clarity and usability.
• Applied HTML5 semantic markup and W3C accessibility guidelines throughout all UI deliverables, supporting inclusive design across the platform.
• Ensured cross-browser and mobile compatibility through systematic testing, maintaining a consistent visual experience for all users.

Skills: UI Design · HTML5 · CSS3 · SCSS · Angular · Bootstrap · Accessibility (W3C / WCAG) · Responsive Design · Jira · Confluence · Agile

• Translated design mockups into interactive UI using AngularJS and Kendo, building dynamic data grid displays for a business automation platform.
• Acted as de facto UI/UX designer in the absence of a dedicated designer, creating conceptual layouts and visual solutions to unblock project delivery.
• Designed and produced custom SVG chart maps for data visualization, from CAD source files to high-quality, scalable web graphics.

Skills: UI Design · Visual Design · SVG · Data Visualization · AngularJS · SASS · Responsive Design · Umbraco CMS · Agile

• Translated PSD designs into pixel-accurate, responsive HTML/SCSS, bridging the gap between visual design and working front-end implementation.
• Built fluid grid layouts ensuring a consistent, visually polished experience across devices and screen sizes.

Skills: HTML5 · CSS3 · SCSS · Responsive Design · Bootstrap · jQuery · Adobe Photoshop · GitHub

• Created UI/UX wireframes in Balsamiq and translated them through Photoshop into front-end prototypes, supporting a full design-to-code workflow.
• Designed responsive HTML email templates for marketing campaigns, optimizing visual appeal and compatibility across email clients.
• Managed and updated web content in Sitecore CMS, maintaining accuracy and brand consistency across the organization's digital presence.

Skills: UI/UX Design · Wireframing · Prototyping · Responsive Web Design · HTML5 · CSS3 · jQuery · Adobe Photoshop · Sitecore CMS · Email Design

• Translated PSD designs into responsive, cross-browser HTML/CSS, maintaining design fidelity and visual quality across devices.
• Collaborated with the design team to align front-end implementation with visual design intent and UX expectations.

Skills: HTML5 · CSS3 · Responsive Design · Mobile-Friendly Design · jQuery · Adobe Photoshop