{"title":"Figma","description":"","products":[{"product_id":"personas","title":"Personas","description":"\u003cp\u003e\u003cspan style=\"font-weight: 400;\" data-mce-style=\"font-weight: 400;\" data-mce-fragment=\"1\"\u003eCreating user personas is easy with UX Kits Personas, a flexible template that allows you to quickly create \u003c\/span\u003eeverything from simple persona cards to detailed docs with demographics, timelines and flows. Stop creating everything from scratch and speed up your workflow by using the kit to create your personas in no time. Personas is modular, with 28 different blocks to build personas to meet the requirements of your projects. Also included is a character building kit, with countless combinations of people illustrations for your personas created by swapping out skin tone, hair, expressions, clothing and accessories.\u003c\/p\u003e\n\u003cp\u003ePersonas includes:\u003c\/p\u003e\n\u003cul\u003e\n\u003cli\u003e10 template examples to speed up your process (plus 3 bonus for Figma*)\u003c\/li\u003e\n\u003cli\u003eLarge collection of 28 components \/ symbols\u003c\/li\u003e\n\u003cli\u003eFlexible templates to create small to large deliverables\u003c\/li\u003e\n\u003cli\u003eType and color styles for easy styling or rebranding\u003c\/li\u003e\n\u003cli\u003eCharacter building kit to create persona illustrations\u003c\/li\u003e\n\u003cli\u003eSample people photos, if \u003cspan\u003eyou prefer over illustrations\u003c\/span\u003e\n\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003cp\u003e*\u003cstrong\u003e \u003c\/strong\u003eTo go along with the release of \u003ca title=\"journey maps\" href=\"https:\/\/uxkits.com\/products\/journey-map\"\u003eJourney Maps\u003c\/a\u003e, the minimalist (white) style is in the Figma version.\u003c\/p\u003e","brand":"Modular, flexible user personas","offers":[{"title":"Figma","offer_id":37083791098008,"sku":"personas-fig","price":25.0,"currency_code":"USD","in_stock":true},{"title":"Sketch","offer_id":37039045542040,"sku":"personas-sk","price":25.0,"currency_code":"USD","in_stock":true},{"title":"Adobe XD","offer_id":37084095053976,"sku":"personas-xd","price":25.0,"currency_code":"USD","in_stock":true},{"title":"Bundle","offer_id":37084176711832,"sku":"personas-bundle","price":39.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0018\/9262\/files\/sample-minimal.png?v=1728658892"},{"product_id":"cards-wireframe-kit","title":"Cards Wireframe Kit","description":"\u003cp\u003eCreate low-fidelity documents that communicate layout, content and hierarchy without mistaking wireframes for design. This Kit for \u003cstrong data-mce-fragment=\"1\"\u003eFigma, Sketch and Adobe XD\u003c\/strong\u003e is the perfect companion to the physical \u003ca title=\"wireframe deck\" href=\"\/products\/wireframe-deck\"\u003eWireframe Deck\u003c\/a\u003e, as it includes all of the low-fidelity components in the deck and allows you to t\u003cspan data-mce-fragment=\"1\"\u003eake your wireframes from cards to screen.\u003c\/span\u003e\u003cbr\u003e\u003cbr\u003eThe Kit includes all 3 formats and is optimized for each app, taking advantage of symbols, components, styles, overrides, etc. for a quick workflow.\u003c\/p\u003e","brand":"Low-fi wireframing companion to the Wireframe Deck","offers":[{"title":"Default Title","offer_id":40656429777048,"sku":"cards-wk","price":19.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0018\/9262\/products\/websample1.png?v=1641226698"},{"product_id":"journey-map","title":"Journey Maps","description":"\u003cp\u003e\u003cspan data-mce-fragment=\"1\"\u003eEasily create customer journey maps with UX Kits Journey Map for Figma. The Kit includes:\u003c\/span\u003e\u003c\/p\u003e\n\u003cul\u003e\n\u003cli\u003e\u003cspan data-mce-fragment=\"1\"\u003e8 variations of the \u003cspan\u003etemplate to speed up your design process\u003c\/span\u003e\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan data-mce-fragment=\"1\"\u003e\u003cspan\u003e\u003cmeta charset=\"utf-8\"\u003e \u003cmeta charset=\"utf-8\"\u003eFlexible auto-layout and resizing options \u003c\/span\u003e\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan data-mce-fragment=\"1\"\u003e\u003cspan\u003e\u003cmeta charset=\"utf-8\"\u003e \u003cmeta charset=\"utf-8\"\u003eSet of components to allow easy reformatting of global elements\u003c\/span\u003e\u003c\/span\u003e\u003c\/li\u003e\n\u003cli\u003e\u003cspan data-mce-fragment=\"1\"\u003e\u003cspan\u003e\u003cmeta charset=\"utf-8\"\u003e \u003cmeta charset=\"utf-8\"\u003eText styles and multiple color palettes for easily applying a new look and feel\u003c\/span\u003e\u003c\/span\u003e\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003cp\u003e\u003cspan data-mce-fragment=\"1\"\u003eA journey map is a representation of how customers engage with a product or service over time. You can use journey maps to identify a customer’s thoughts, feelings, pain points and successes across a scenario, touch point or channel. This allows you to find opportunities, changes or areas in need of attention.\u003c\/span\u003e\u003cbr\u003e\u003c\/p\u003e","brand":"Flexible customer journey maps for Figma","offers":[{"title":"Default Title","offer_id":45997064388864,"sku":"journey-maps-fig","price":25.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0018\/9262\/files\/journey1.png?v=1728405941"},{"product_id":"wireframes-for-figma","title":"Wireframes","description":"\u003cp\u003eEverything you need to quickly wireframe in Figma at the right fidelity: Not lines and shapes, not finished design.\u003c\/p\u003e\n\u003cul\u003e\n\u003cli\u003eOver 300 responsive auto-layout wireframe components and elements.\u003cbr\u003e\n\u003c\/li\u003e\n\u003cli\u003eWireframe Builder plugin: Search components, drag and drop, and generate wireframes instantly.\u003cbr\u003e\n\u003c\/li\u003e\n\u003cli\u003eFigma design system of text and color styles to easily redesign your wireframes.\u003c\/li\u003e\n\u003cli\u003eWireframe examples as a starting point.\u003c\/li\u003e\n\u003c\/ul\u003e\n\u003cp\u003eDesign by hand, use the plugin, or combine with the \u003ca href=\"\/products\/ai-html-wireframes\" title=\"ai wireframes\"\u003eAI Wireframe System\u003c\/a\u003e and \u003ca href=\"\/products\/wireframe-deck\" title=\"wireframe deck\"\u003eWireframe Deck\u003c\/a\u003e.\u003c\/p\u003e\n\u003ch3\u003e\n\u003cstrong\u003eWhat you get\u003c\/strong\u003e\u003cspan class=\"font-semibold\" data-streamdown=\"strong\"\u003e\u003cstrong\u003e\u003c\/strong\u003e\u003c\/span\u003e\n\u003c\/h3\u003e\n\u003cp\u003e\u003cstrong\u003e\u003cspan class=\"font-semibold\" data-streamdown=\"strong\"\u003eFigma library\u003cbr\u003e\u003c\/span\u003e\u003c\/strong\u003eA huge library of auto-layout, wireframe-fidelity components across 10 categories. Easily redesign: Built from smaller shared components and a shared system of Figma color and text styles.\u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003eFigma plugin\u003cbr\u003e\u003c\/strong\u003eThe included custom plugin lets you build wireframes by searching the component library, with a drag n drop multi-column interface. Click \"Build Wireframe\" and the plugin instantly generates the full Figma wireframe. \u003c\/p\u003e\n\u003cp\u003e\u003cstrong\u003eWireframe Deck + AI System compatible\u003cbr\u003e\u003c\/strong\u003eGo from a photo of a \u003ca href=\"https:\/\/uxkits.com\/products\/wireframe-deck\" title=\"wireframe deck\"\u003eWireframe Deck\u003c\/a\u003e card layout to an AI chat to a wireframe in Figma in a few clicks. Add the \u003ca href=\"\/products\/ai-html-wireframes\" title=\"ai wireframes\"\u003eAI Wireframe System\u003c\/a\u003e to generate matching HTML wireframes from prompts, all matching the same design system.\u003c\/p\u003e","brand":"Automated Figma Wireframe Builder","offers":[{"title":"Default Title","offer_id":48714940776704,"sku":"figma-wireframe-kit-v1","price":29.0,"currency_code":"USD","in_stock":true}],"thumbnail_url":"\/\/cdn.shopify.com\/s\/files\/1\/0018\/9262\/files\/figma-wireframes-1_2320b997-b972-460c-ae9c-5b74a1e247ce.png?v=1781185056"}],"url":"https:\/\/uxkits.com\/collections\/figma.oembed","provider":"UX Kits","version":"1.0","type":"link"}