Hi, I'm João David Nogueira
Hi, I'm João David Nogueira
Based in Portugal, I am a UX/UI Designer and visual storyteller blending 15 years of cross-disciplinary strategy with modern execution. Drawing from cultural semiotics, filmmaking, and B2B management, I look beyond the screen to design intuitive, emotion-driven products that connect with real users everywhere.
Based in Portugal, I am a UX/UI Designer and visual storyteller blending 15 years of cross-disciplinary strategy with modern execution. Drawing from cultural semiotics, filmmaking, and B2B management, I look beyond the screen to design intuitive, emotion-driven products that connect with real users everywhere.
Make it Real. Make it Human.
Empathy is in my nature.
Frontline support experience sharpened that natural instinct into a core UX discipline.
Lateral thinking by design.
A cross-disciplinary mindset paired with innovative tools lets me bypass standard defaults, crafting highly original solutions at pace.
Human impact. Your business results.
Design Decisions that convert.
Design that is alive.
Product Design Enhancement.
Translating complex friction into clear, structured interfaces. Deep cross-functional partnership ensures business strategy aligns perfectly with intuitive, human-centered execution across the entire product lifecycle.
User Research | Stakeholder alignment | Data-driven Design | Product Overview | Information Architecture | User Flows & CJM.
Product Design Enhancement.
Translating complex friction into clear, structured interfaces. Deep cross-functional partnership ensures business strategy aligns perfectly with intuitive, human-centered execution across the entire product lifecycle.
User Research | Stakeholder alignment | Data-driven Design | Product Overview | Information Architecture | User Flows & CJM.
Filmmaking.
Anchoring digital products in human storytelling. A background in conceptual direction and high-stakes pitching at Cannes and Berlinale translates cinematic visual semiotics into compelling product visions that secure executive buy-in.
Creative Direction | Storyboarding | Screenwriting | Video & Sound Editing Conceptual Development | Narrative Strategy | Directing | Executive Pitching.
Filmmaking.
Anchoring digital products in human storytelling. A background in conceptual direction and high-stakes pitching at Cannes and Berlinale translates cinematic visual semiotics into compelling product visions that secure executive buy-in.
Creative Direction | Storyboarding | Screenwriting | Video & Sound Editing Conceptual Development | Narrative Strategy | Directing | Executive Pitching.
Design Systems.
Building the DNA of scalable digital products. Robust component libraries and systematic token architectures ensure visual consistency and accelerate cross-functional development.
Design Tokens | GEO | Documentation | Design.md | Governance.
Design Systems.
Building the DNA of scalable digital products. Robust component libraries and systematic token architectures ensure visual consistency and accelerate cross-functional development.
Design Tokens | GEO | Documentation | Design.md | Governance.
AI Enhanced Workflows.
Augmenting the design process with intelligent workflows. Pairing human strategy with automated pattern recognition accelerates execution, ensuring high-quality, innovative results at a modern pace.
AI Assited Tooling | Patter Recognition | Automate Research & QA | Human-AI integration.
AI Enhanced Workflows.
Augmenting the design process with intelligent workflows. Pairing human strategy with automated pattern recognition accelerates execution, ensuring high-quality, innovative results at a modern pace.
AI Assited Tooling | Patter Recognition | Automate Research & QA | Human-AI integration.
Research.
Driving product strategy through validated insights. Synthesizing qualitative observation with quantitative data translates complex signals into clear, actionable design solutions.
User Research | User Psychology | Stakeholder alignment | Data-driven Design | Product Overview | Information Architecture | User Flows & CJM.
Research.
Driving product strategy through validated insights. Synthesizing qualitative observation with quantitative data translates complex signals into clear, actionable design solutions.
User Research | User Psychology | Stakeholder alignment | Data-driven Design | Product Overview | Information Architecture | User Flows & CJM.
Graphic Design.
"Cognition attempts to make sense of the world: emotion assigns value." — Don Norman. Merging traditional design principles with rich visual storytelling to craft interfaces that don't just work, but genuinely connect.
Visual Identity | Editorial | Branding | Traditional Craftmanship | Mixed Media | Invested & Ever growing Visual Literacy | Design Principles.
Graphic Design.
"Cognition attempts to make sense of the world: emotion assigns value." — Don Norman. Merging traditional design principles with rich visual storytelling to craft interfaces that don't just work, but genuinely connect.
Visual Identity | Editorial | Branding | Traditional Craftmanship | Mixed Media | Invested & Ever growing Visual Literacy | Design Principles.
Webdesign.
Translating visual narratives into functional, interactive platforms. I treat web design as a living medium, crafting interfaces that don't just display information, but actively connect with the user—digital spaces that carry genuine essence across all devices.
High-Fidelity UI | Framer Development | CMS Integration | Interaction & Motion | Wireframing | Visual Storytelling | Basic HTML, CSS & JS
Webdesign.
Translating visual narratives into functional, interactive platforms. I treat web design as a living medium, crafting interfaces that don't just display information, but actively connect with the user—digital spaces that carry genuine essence across all devices.
High-Fidelity UI | Framer Development | CMS Integration | Interaction & Motion | Wireframing | Visual Storytelling | Basic HTML, CSS & JS
The Toolkit.
This is the daily toolkit I rely on to get the work done. I use this exact stack to turn rough strategy into high-fidelity products you can actually interact with.
Figma | Basic HTML, CSS & JS | Framer | Procreate | Adobe Creative Suite | Premiere Pro | Google Gemini, Gemini API | DaVinci Resolve.
The Toolkit.
This is the daily toolkit I rely on to get the work done. I use this exact stack to turn rough strategy into high-fidelity products you can actually interact with.
Figma | Basic HTML, CSS & JS | Framer | Procreate | Adobe Creative Suite | Premiere Pro | Google Gemini, Gemini API | DaVinci Resolve.
Going on a Scrolling Adventure
![](data:image/svg+xml,<svg display="block" role="presentation" viewBox="0 0 16 13" xmlns="http://www.w3.org/2000/svg"><g d="M 11.644 9.984 C 11.647 10.163 11.649 10.342 11.648 10.521 C 11.647 11.128 11.55 11.531 11.112 11.971 C 10.541 12.545 9.885 12.504 9.154 12.502 L 7.598 12.5 L 2.006 12.503 C 1.41 12.501 0.944 12.378 0.516 11.944 C -0.029 11.391 0 10.688 0.001 9.984 L 0.001 8.68 L 0 4.091 C 0.007 2.968 0.31 2.008 1.105 1.202 C 1.795 0.501 2.621 0.142 3.594 0.026 C 3.969 -0.018 4.436 0.007 4.82 0.007 L 6.281 0.008 L 9.788 0.006 C 10.211 0.01 10.768 0.175 11.066 0.489 C 11.753 1.214 11.655 2.071 11.645 2.982 C 11.649 3.131 11.63 3.86 11.643 3.931 C 11.604 4.242 11.645 4.725 11.628 5.058 C 11.639 5.937 11.626 6.819 11.63 7.698 C 11.631 7.786 11.632 7.878 11.628 7.966 C 11.641 8.339 11.631 8.728 11.634 9.103 C 11.643 9.396 11.646 9.69 11.644 9.984 Z M 11.611 10.262 C 11.603 10.202 11.59 9.95 11.58 9.921 C 11.564 9.918 11.549 9.916 11.534 9.912 C 10.752 9.721 9.311 8.383 8.874 7.694 C 7.624 5.721 9.841 4.077 11.295 3.108 C 11.364 3.062 11.504 2.987 11.584 3.013 C 11.6 2.923 11.575 2.789 11.604 2.715 C 11.626 2.761 11.641 2.914 11.647 2.973 C 11.652 3.122 11.633 3.851 11.646 3.922 C 11.607 4.233 11.648 4.716 11.631 5.049 C 11.642 5.928 11.628 6.81 11.633 7.69 C 11.634 7.778 11.635 7.869 11.631 7.957 C 11.643 8.33 11.634 8.719 11.637 9.094 C 11.646 9.388 11.649 9.681 11.647 9.975 Z M 11.639 7.96 C 11.62 8.089 11.641 8.423 11.572 8.497 C 11.522 8.49 11.466 8.427 11.414 8.398 C 10.706 8.014 10.03 7.037 10.209 6.205 C 10.332 5.638 10.713 5.104 11.143 4.73 C 11.249 4.637 11.465 4.566 11.596 4.479 C 11.626 4.625 11.621 4.883 11.639 5.052 C 11.65 5.932 11.637 6.813 11.641 7.693 C 11.642 7.781 11.643 7.872 11.639 7.96 Z M 2.604 8.515 C 3.298 8.431 3.929 8.925 4.013 9.619 C 4.097 10.313 3.602 10.943 2.908 11.026 C 2.215 11.109 1.586 10.615 1.502 9.922 C 1.418 9.23 1.911 8.6 2.604 8.515 Z M 11.645 3.901 C 12.356 3.353 13.064 2.724 13.85 2.286 C 13.877 2.271 13.909 2.236 13.935 2.217 C 14.703 1.439 15.936 1.826 15.986 2.959 C 16.005 3.383 15.994 3.862 15.993 4.308 L 15.992 6.889 L 15.992 8.92 C 15.993 9.27 16.018 9.745 15.975 10.077 C 15.864 10.947 14.933 11.288 14.213 10.83 C 13.931 10.651 11.703 9.055 11.636 9.073 C 11.633 8.697 11.643 8.309 11.63 7.936 C 11.634 7.848 11.633 7.756 11.632 7.668 C 11.628 6.789 11.641 5.907 11.63 5.028 C 11.647 4.695 11.607 4.212 11.645 3.901 Z" fill="transparent" height="12.503033318007633px" id="qEdHgo3xV" width="15.999999324684891px"><path d="M 11.644 9.984 C 11.647 10.163 11.649 10.342 11.648 10.521 C 11.647 11.128 11.55 11.531 11.112 11.971 C 10.541 12.545 9.885 12.504 9.154 12.502 L 7.598 12.5 L 2.006 12.503 C 1.41 12.501 0.944 12.378 0.516 11.944 C -0.029 11.391 0 10.688 0.001 9.984 L 0.001 8.68 L 0 4.091 C 0.007 2.968 0.31 2.008 1.105 1.202 C 1.795 0.501 2.621 0.142 3.594 0.026 C 3.969 -0.018 4.436 0.007 4.82 0.007 L 6.281 0.008 L 9.788 0.006 C 10.211 0.01 10.768 0.175 11.066 0.489 C 11.753 1.214 11.655 2.071 11.645 2.982 C 11.649 3.131 11.63 3.86 11.643 3.931 C 11.604 4.242 11.645 4.725 11.628 5.058 C 11.639 5.937 11.626 6.819 11.63 7.698 C 11.631 7.786 11.632 7.878 11.628 7.966 C 11.641 8.339 11.631 8.728 11.634 9.103 C 11.643 9.396 11.646 9.69 11.644 9.984 Z" fill="rgb(254, 212, 21)" height="12.50303331800764px" id="Qrf2THiZ1" transform="translate(0 0)" width="11.655179932484916px"/><path d="M 3.105 7.547 C 3.097 7.487 3.084 7.236 3.074 7.206 C 3.058 7.204 3.043 7.201 3.028 7.197 C 2.246 7.006 0.805 5.669 0.368 4.979 C -0.881 3.007 1.335 1.362 2.789 0.393 C 2.858 0.347 2.998 0.273 3.079 0.299 C 3.094 0.208 3.069 0.075 3.098 0 C 3.12 0.046 3.135 0.199 3.141 0.259 C 3.146 0.408 3.127 1.136 3.14 1.207 C 3.101 1.519 3.142 2.001 3.125 2.334 C 3.136 3.214 3.122 4.095 3.127 4.975 C 3.128 5.063 3.129 5.154 3.125 5.242 C 3.137 5.616 3.128 6.004 3.131 6.379 C 3.14 6.673 3.143 6.967 3.141 7.261 Z" fill="rgb(255, 204, 142)" height="7.547065800069635px" id="mXr_Dm24S" transform="translate(8.506 2.715)" width="3.142067821969685px"/><path d="M 1.459 3.481 C 1.44 3.61 1.461 3.944 1.392 4.018 C 1.342 4.011 1.286 3.947 1.234 3.919 C 0.526 3.535 -0.15 2.558 0.029 1.726 C 0.152 1.159 0.533 0.624 0.963 0.251 C 1.069 0.158 1.285 0.087 1.416 0 C 1.446 0.146 1.441 0.404 1.459 0.573 C 1.47 1.453 1.457 2.334 1.461 3.214 C 1.462 3.302 1.463 3.393 1.459 3.481 Z" fill="rgb(255, 192, 199)" height="4.018079802720429px" id="Auwwn7ysj" transform="translate(10.18 4.479)" width="1.4637361282138754px"/><path d="M 1.111 0.01 C 1.805 -0.075 2.436 0.419 2.52 1.113 C 2.604 1.807 2.109 2.437 1.415 2.52 C 0.722 2.603 0.093 2.109 0.009 1.417 C -0.075 0.724 0.418 0.094 1.111 0.01 Z" fill="rgb(254, 254, 254)" height="2.5291167942065864px" id="u1587cuT4" transform="translate(1.493 8.506)" width="2.5291147904148685px"/><path d="M 0.017 2.091 C 0.728 1.544 1.436 0.915 2.222 0.476 C 2.249 0.461 2.281 0.426 2.307 0.407 C 3.076 -0.371 4.308 0.016 4.359 1.15 C 4.377 1.573 4.366 2.052 4.365 2.499 L 4.364 5.079 L 4.364 7.11 C 4.365 7.46 4.39 7.935 4.347 8.268 C 4.236 9.137 3.305 9.478 2.585 9.021 C 2.303 8.841 0.075 7.245 0.008 7.263 C 0.005 6.888 0.015 6.499 0.002 6.126 C 0.006 6.038 0.005 5.947 0.005 5.859 C 0 4.979 0.014 4.097 0.002 3.218 C 0.02 2.885 -0.021 2.402 0.017 2.091 Z" fill="rgb(250, 171, 0)" height="9.224112768256546px" id="jNgOuCiib" transform="translate(11.628 1.81)" width="4.372145931130202px"/></g></svg>)
hello@jdnogueira.eu
hello@jdnogueira.eu
