[{"data":1,"prerenderedAt":314},["ShallowReactive",2],{"site":3,"skill-banks":15,"skill-tools":58},{"id":4,"name":5,"role_title":6,"email":7,"linkedin":8,"location":9,"tagline":10,"summary":11,"monogram":12,"portrait":13,"location_url":14},1,"Niko Zarzani","Senior Product Designer","niko.zarzani@gmail.com","https:\u002F\u002Fwww.linkedin.com\u002Fin\u002Fniko-zarzani","Jesi · Marche · Italy","Let's make something impactful together.","Senior product designer & PM, 12+ years shipping web and mobile products: strategy, UX\u002FUI and delivery, with an engineer's grounding (ex-developer, ex-AWS certified) and AI-assisted workflows. From AI and IoT to logistics, insurance, pharma, fashion, food and more.","https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F89f1fee8-7586-4cc0-961e-21a7d6d0fa16.svg","https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F3a494fbd-d1cc-4490-beb2-d89040dc4ab2.jpg","https:\u002F\u002Fmaps.app.goo.gl\u002F39dnX5jfFfCeZnVYA",[16,31,45],{"name":17,"channels":18},"Research",[19,22,25,28],[20,21],"User Research",80,[23,24],"Usability",76,[26,27],"Information Architecture",84,[29,30],"Collaboration",88,{"name":32,"channels":33},"Design",[34,37,39,42],[35,36],"UX Design",92,[38,30],"UI Design",[40,41],"Prototype & Testing",86,[43,44],"Design Systems",90,{"name":46,"channels":47},"Engineering",[48,51,53,55],[49,50],"Cloud Architecture",70,[52,27],"AI Design",[54,27],"Handoff",[56,57],"Development",78,[59,67,74,80,82,89,96,103,110,117,124,131,138,140,142,148,154,159,166,173,180,182,188,195,197,203,209,215,221,227,233,239,245,252,258,264,270,276,282,284,290,296,302,308],{"skill_name":20,"name":60,"sort":4,"icon":61,"mono":62,"invert_dark":63,"description":64,"use_cases":65,"approach_phases":66},"Dovetail","https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F3224bf25-3a13-4f8c-b80a-b6e84d7834f7.svg",null,0,"Research repository for tagging, synthesising and sharing qualitative insights from user interviews.","After empathy-building sessions I use Dovetail to cluster observations, run thematic analysis and turn raw interview notes into patterns the whole team can act on, without jumping to solutions too early.","empathize",{"skill_name":20,"name":68,"sort":69,"icon":70,"mono":62,"invert_dark":63,"description":71,"use_cases":72,"approach_phases":73},"Maze",2,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fa4a40993-5fd5-4d96-88d1-e46e013bcb9c.svg","Rapid usability testing and research, from unmoderated prototype tests to survey-style studies.","I reach for Maze during the empathize phase for quick user interviews and surveys, and again in test for guerrilla and remote usability sessions when I need fast feedback on a prototype before committing to a full lab study.","empathize,test",{"skill_name":20,"name":75,"sort":76,"icon":77,"mono":62,"invert_dark":63,"description":78,"use_cases":79,"approach_phases":66},"Google Forms",3,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F23354248-1411-49b7-8b13-a3cae1dd1c75.svg","Lightweight surveys to gather quantitative data from a larger sample of users.","When I need to distribute a survey beyond a handful of interviewees, covering demographics, preferences and behaviours, Forms is the fastest way to reach a representative sample and complement one-on-one empathy work.",{"skill_name":23,"name":68,"sort":81,"icon":70,"mono":62,"invert_dark":63,"description":71,"use_cases":72,"approach_phases":73},4,{"skill_name":23,"name":83,"sort":84,"icon":85,"mono":62,"invert_dark":63,"description":86,"use_cases":87,"approach_phases":88},"PostHog",5,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F01ca08fe-11b9-44fa-bbb8-df0c273eb9dd.svg","Product analytics for understanding real-world usage after launch.","In the test and post-launch loop I review usage metrics to validate whether the product is viable and to spot behaviours that deserve deeper investigation through additional user research.","test,misc",{"skill_name":23,"name":90,"sort":91,"icon":92,"mono":62,"invert_dark":63,"description":93,"use_cases":94,"approach_phases":95},"Hotjar",6,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F3e16a2f0-f42a-4e94-81b3-f46a74cf9e02.svg","Heatmaps and session recordings to observe how people actually use a live product.","After shipping I use Hotjar to review real interactions, identify friction points and prioritise improvements. It is a cheap complement to formal usability tests when budget or timeline is tight.","test",{"skill_name":26,"name":97,"sort":98,"icon":99,"mono":62,"invert_dark":63,"description":100,"use_cases":101,"approach_phases":102},"FigJam",7,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F0049edac-eb37-4542-a778-7c5ab0745afe.svg","Collaborative whiteboard for workshops, mapping and early-structure thinking.","I use FigJam for affinity diagramming, journey mapping, stakeholder mapping and ideation warm-ups, especially when the project team needs to cluster research findings or map a user journey together in define and ideate.","define,ideate,misc",{"skill_name":26,"name":104,"sort":105,"icon":106,"mono":62,"invert_dark":63,"description":107,"use_cases":108,"approach_phases":109},"Draw.io",8,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F2d7945cf-f528-4baa-b5d7-b89d02e78021.svg","Diagramming for information architecture, flows and technical structure.","For complex projects I organise content into entity-relationship diagrams and navigation flows that developers can review and extend, keeping ideation grounded in technical feasibility.","define,misc",{"skill_name":26,"name":111,"sort":112,"icon":113,"mono":62,"invert_dark":63,"description":114,"use_cases":115,"approach_phases":116},"Excalidraw",9,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F6e2c6026-e83a-457b-aa38-4bdb14ce0fd5.svg","Hand-drawn-style sketching for quick, disposable exploration of ideas.","In ideate I sketch on a blank canvas to explore multiple design directions at low cost. The roughness invites honest feedback from teammates who might hold back on a polished digital prototype.","ideate,prototype",{"skill_name":29,"name":118,"sort":119,"icon":120,"mono":62,"invert_dark":63,"description":121,"use_cases":122,"approach_phases":123},"Slack",10,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F866d379d-90eb-4a07-b555-a64c8bd4bb08.svg","Async team communication across design, product and engineering.","Throughout every phase I use Slack to share research findings, coordinate workshops and keep stakeholders updated, especially after story-share-and-capture sessions when the team needs to stay aligned on user insights.","empathize,define,ideate,prototype,test,misc",{"skill_name":29,"name":125,"sort":126,"icon":127,"mono":62,"invert_dark":63,"description":128,"use_cases":129,"approach_phases":130},"Loom",11,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fe82aa43f-9c8f-4185-9a7b-6f79d1522ca7.svg","Async video updates for walkthroughs, feedback requests and handoff.","When I cannot respond immediately to a call or message, a Loom walkthrough of a prototype or audit findings reduces interruptions and keeps the team moving without me becoming a bottleneck.","prototype,test,misc",{"skill_name":29,"name":132,"sort":133,"icon":134,"mono":62,"invert_dark":63,"description":135,"use_cases":136,"approach_phases":137},"Teams",12,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fb7473759-86ad-4e1b-a761-ef551dfe9809.svg","Video calls and collaboration with enterprise clients and distributed teams.","For moderated remote usability tests, design reviews and stakeholder workshops I rely on Teams when the client ecosystem standardises on Microsoft, keeping empathy and alignment sessions accessible across locations.","empathize,prototype,test,misc",{"skill_name":35,"name":97,"sort":139,"icon":99,"mono":62,"invert_dark":63,"description":100,"use_cases":101,"approach_phases":102},13,{"skill_name":35,"name":111,"sort":141,"icon":113,"mono":62,"invert_dark":63,"description":114,"use_cases":115,"approach_phases":116},14,{"skill_name":35,"name":143,"sort":144,"icon":62,"mono":143,"invert_dark":63,"description":145,"use_cases":146,"approach_phases":147},"BMAD",15,"Agentic framework for structuring AI-assisted product and design exploration.","In UX exploration I use BMAD to scaffold AI-assisted ideation and documentation, accelerating synthesis while keeping outputs aligned with user needs and business goals.","ideate,misc",{"skill_name":35,"name":149,"sort":150,"icon":151,"mono":62,"invert_dark":63,"description":152,"use_cases":153,"approach_phases":147},"SkillsMP",16,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F29bb4eac-9a60-41f8-9a00-893ffad375ba.svg","Skills marketplace patterns for structuring AI agent capabilities.","When prototyping AI-assisted workflows I reference SkillsMP patterns to define what an agent should and should not do, keeping explorations scoped and testable.",{"skill_name":38,"name":155,"sort":156,"icon":99,"mono":62,"invert_dark":63,"description":157,"use_cases":158,"approach_phases":130},"Figma",17,"My go-to for interactive UI prototypes, from wireframes to hi-fi mockups stakeholders can click through.","I build prototypes to test with users and to support design reviews, demonstrating navigation and interaction flows to PMs and developers. A polished Figma prototype is also my best ally when persuading clients or handing designs over to dev teams.",{"skill_name":38,"name":160,"sort":161,"icon":162,"mono":62,"invert_dark":63,"description":163,"use_cases":164,"approach_phases":165},"Adobe XD",18,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F434e22fb-5e87-4d08-b2a5-aa78b5ae40d4.svg","Interactive UI mockups for design reviews and stakeholder presentations.","Alongside Figma I use XD for hi-fi prototypes when a team or client already works in the Adobe ecosystem, especially for demonstrating flows during design reviews and early funding conversations.","prototype,test",{"skill_name":38,"name":167,"sort":168,"icon":169,"mono":62,"invert_dark":63,"description":170,"use_cases":171,"approach_phases":172},"Stark",19,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fe9630577-cbd3-416d-b6f6-efaa4827dedd.svg","Accessibility checks integrated into the UI design workflow.","While crafting hi-fi screens I run contrast and accessibility checks so the product meets web and mobile accessibility guidelines. This is particularly important when adopting a standard design system.","prototype,misc",{"skill_name":38,"name":174,"sort":175,"icon":176,"mono":62,"invert_dark":63,"description":177,"use_cases":178,"approach_phases":179},"Coolors",20,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fe418fe19-b1b9-4318-a1a0-93be87db890e.svg","Palette exploration for cohesive visual language across a product.","In UI design I use Coolors to explore and refine colour systems that support hierarchy and readability, before locking tokens into a design system.","prototype",{"skill_name":40,"name":155,"sort":181,"icon":99,"mono":62,"invert_dark":63,"description":157,"use_cases":158,"approach_phases":130},21,{"skill_name":40,"name":183,"sort":184,"icon":185,"mono":62,"invert_dark":63,"description":186,"use_cases":187,"approach_phases":172},"GitHub",22,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F81b89bc5-ff2d-4a83-9095-9791fc87021c.svg","Version control for coded prototypes and design asset collaboration.","When a coded prototype is cheaper than a pixel-perfect mockup, or when the design will evolve with user feedback, I use GitHub to manage changes and collaborate with developers on implementation details.",{"skill_name":40,"name":189,"sort":190,"icon":191,"mono":62,"invert_dark":63,"description":192,"use_cases":193,"approach_phases":194},"Excel",23,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fbfba3663-817d-4f06-8f7e-37186b958008.svg","Activity tracking and scope management for non-agile projects.","On projects that do not follow a full agile workflow I track activity completion in spreadsheets to ensure we stay within scope, complementing the sprint backlog in Jira when both rhythms coexist.","misc",{"skill_name":43,"name":155,"sort":196,"icon":99,"mono":62,"invert_dark":63,"description":157,"use_cases":158,"approach_phases":130},24,{"skill_name":43,"name":198,"sort":199,"icon":200,"mono":62,"invert_dark":63,"description":201,"use_cases":202,"approach_phases":194},"Storybook",25,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F4320e30e-f76d-4a93-a455-8a4f176ed17c.svg","Component library playground shared between design and development.","For design systems I use Storybook so designers and developers work from the same component patterns, reducing drift between Figma specs and shipped UI.",{"skill_name":43,"name":204,"sort":205,"icon":206,"mono":62,"invert_dark":4,"description":207,"use_cases":208,"approach_phases":194},"Zeroheight",26,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F23beb678-db3c-4a8b-b42f-670e0757e4d2.svg","Design system documentation bridging Figma components and dev implementation.","I publish design system guidelines and component specs in Zeroheight for handoff, so developers have a single source of truth beyond the prototype, especially for tokens, patterns and usage rules.",{"skill_name":49,"name":210,"sort":211,"icon":212,"mono":62,"invert_dark":63,"description":213,"use_cases":214,"approach_phases":194},"AWS",27,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fa069693e-ac21-408f-860c-5db6091097a6.svg","Cloud infrastructure for scalable digital platforms.","When defining cloud architecture for a new product I collaborate with architects on AWS-based three-layer setups, aligning user needs, scalability requirements and business objectives beyond the interface alone.",{"skill_name":49,"name":216,"sort":217,"icon":218,"mono":62,"invert_dark":63,"description":219,"use_cases":220,"approach_phases":194},"Azure",28,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F5bfe1719-1f0a-401f-a27c-3f707c694392.svg","Enterprise cloud platform for hosted services and integrations.","On enterprise engagements I work with Azure when the client stack or compliance requirements standardise on Microsoft, ensuring the cloud architecture supports the user experience we are designing.",{"skill_name":49,"name":222,"sort":223,"icon":224,"mono":62,"invert_dark":63,"description":225,"use_cases":226,"approach_phases":172},"Vercel",29,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fd69d77ce-4669-4a83-9c17-d4165527cc5f.svg","Frontend deployment for prototypes and production web apps.","For coded prototypes and headless CMS-backed sites I deploy on Vercel to get a shareable URL quickly, useful for live prototype tests and stakeholder reviews without a full release cycle.",{"skill_name":49,"name":228,"sort":229,"icon":230,"mono":62,"invert_dark":63,"description":231,"use_cases":232,"approach_phases":194},"Directus",30,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F783a3aa3-275f-4172-9b8a-7115fd9598ef.svg","Headless CMS for content-driven products and portfolio sites.","I use Directus when a product needs a flexible content layer, pairing it with a modern frontend so editors and designers can iterate without redeploying the whole application.",{"skill_name":49,"name":234,"sort":235,"icon":236,"mono":62,"invert_dark":63,"description":237,"use_cases":238,"approach_phases":194},"Bash",31,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fb6477670-b9a3-4e29-8709-9f25e8f9d0a7.svg","Shell scripting for automation, deployment and local dev workflows.","With an engineering background I write Bash scripts to automate build steps, seed content and glue together cloud services, keeping design explorations connected to how things actually ship.",{"skill_name":52,"name":240,"sort":241,"icon":242,"mono":62,"invert_dark":63,"description":243,"use_cases":244,"approach_phases":147},"Anthropic",32,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F20087c07-326f-4604-9215-c3530a5d039c.svg","LLM provider for research synthesis, ideation and documentation.","I use Claude to accelerate research synthesis, explore product directions and draft documentation, always cross-checking outputs against real user insights and technical feasibility.",{"skill_name":52,"name":246,"sort":247,"icon":248,"mono":62,"invert_dark":63,"description":249,"use_cases":250,"approach_phases":251},"OpenAI",33,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F123b83ef-8df2-4c6a-8d63-f2cc4ba741ff.svg","Generative AI for prototyping conversational and intelligent product features.","When exploring AI-native product concepts I prototype with OpenAI models to test interaction patterns and validate whether an AI feature genuinely solves a user need before investing in production infrastructure.","ideate,prototype,misc",{"skill_name":52,"name":253,"sort":254,"icon":255,"mono":62,"invert_dark":63,"description":256,"use_cases":257,"approach_phases":147},"Hugging Face",34,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F52632745-4863-4cb2-88ff-8078bfcfb845.svg","Model hub for experimenting with open-source ML capabilities.","For AI design explorations I browse Hugging Face to evaluate models and capabilities that might fit a product concept, especially when future-thinking workshops surface emerging technology opportunities.",{"skill_name":52,"name":259,"sort":260,"icon":261,"mono":62,"invert_dark":63,"description":262,"use_cases":263,"approach_phases":147},"N8N",35,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F7869f3cc-cf4f-48d6-98fa-47a17298b5b1.svg","Workflow automation for connecting tools and prototyping agentic pipelines.","I wire up N8N flows to prototype automations, from research ingestion to handoff notifications, so stakeholders can experience an end-to-end process before committing to custom engineering.",{"skill_name":54,"name":265,"sort":266,"icon":267,"mono":62,"invert_dark":63,"description":268,"use_cases":269,"approach_phases":194},"Notion",36,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F628d5a6a-22ac-4f38-9793-470cc0ff9097.svg","Web-based documentation for flexible, collaborative product specs.","I use Notion for handoff docs covering information architecture, navigation flows and component behaviour, supported by prototype visuals. It reduces interruptions from colleagues and forces me to self-assess how each part of the design should work.",{"skill_name":54,"name":271,"sort":272,"icon":273,"mono":62,"invert_dark":63,"description":274,"use_cases":275,"approach_phases":194},"Jira",37,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F596a174c-44f5-4e62-8ece-1e49fd76045c.svg","Agile backlog and sprint planning for design and development delivery.","In my daily project management I plan sprints and populate the backlog in Jira, translating user stories, acceptance criteria and design tasks into work the whole team can track.",{"skill_name":54,"name":277,"sort":278,"icon":279,"mono":62,"invert_dark":63,"description":280,"use_cases":281,"approach_phases":194},"Word",38,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F83207721-d2a1-4f5b-9d28-fe63806e21fc.svg","Formal blueprint documents for print-ready or validated specifications.","When documentation needs to be printed or formally signed off I create blueprint documents in Word, while keeping day-to-day collaborative specs in web-based tools like Notion.",{"skill_name":54,"name":204,"sort":283,"icon":206,"mono":62,"invert_dark":4,"description":207,"use_cases":208,"approach_phases":194},39,{"skill_name":56,"name":285,"sort":286,"icon":287,"mono":62,"invert_dark":63,"description":288,"use_cases":289,"approach_phases":179},"Vue.js",40,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F9662b48d-3f5c-478c-8fe9-b93238cfbb17.svg","Progressive framework for coded prototypes and production frontends.","With a computer science background I sometimes find it cheaper to code a working interface in Vue than to mock every state in Figma, especially for data-heavy dashboards and interactive flows.",{"skill_name":56,"name":291,"sort":292,"icon":293,"mono":62,"invert_dark":63,"description":294,"use_cases":295,"approach_phases":179},"React",41,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F770f504a-31ea-4e6b-ab69-c1456bfd55c3.svg","Component-based UI library for interactive prototypes and web apps.","I reach for React when a coded prototype needs rich interactivity or when handing off to a team that standardises on the React ecosystem, bridging design intent and implementation.",{"skill_name":56,"name":297,"sort":298,"icon":299,"mono":62,"invert_dark":63,"description":300,"use_cases":301,"approach_phases":179},"Swift",42,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F92a40c50-d735-4b18-8ad9-6d862742edde.svg","Native iOS development for mobile prototypes and production apps.","For mobile-first products I prototype or spike features in Swift when native behaviour, gestures or platform conventions matter more than a cross-platform mockup can convey.",{"skill_name":56,"name":303,"sort":304,"icon":305,"mono":62,"invert_dark":63,"description":306,"use_cases":307,"approach_phases":172},"C#",43,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002F4c754990-b9e1-4a7c-a0b2-cedbb7f707b7.svg","Backend and enterprise application development.","On .NET-heavy engagements I use C# to validate technical feasibility early, collaborating with developers on APIs and data models that shape what we can realistically design.",{"skill_name":56,"name":309,"sort":310,"icon":311,"mono":62,"invert_dark":63,"description":312,"use_cases":313,"approach_phases":109},"SQL",44,"https:\u002F\u002Fniko-zarzani-portfolio-assets.s3.eu-north-1.amazonaws.com\u002Fe086d9ae-90c3-40ca-85f0-c4a1ab74e3f9.svg","Structured queries for understanding data models and validating designs.","When information architecture touches complex data relationships I write SQL to explore schemas and validate whether the UI patterns we are designing map to real data constraints.",1784665764447]