[{"data":1,"prerenderedAt":495},["ShallowReactive",2],{"project-34848583":3},{"id":4,"name":5,"line":6,"line_source":7,"title":8,"url":9,"domain":10,"maker":11,"posted_at":12,"year":13,"points":14,"comments":15,"rank_in_year":16,"shown_in_year":17,"top":18,"tier":19,"category":20,"subcategory":21,"format":22,"keywords":23,"reception":28,"sentiment":29,"stance_mix":30,"scored_comments":34,"aspects":35,"strip":45,"post_text":47,"what":48,"said":94,"maker_in_thread":252,"shape":262,"grid":267,"attempts":458,"same_week":459,"maker_shows":39,"maker_hidden":488,"reader_version":489,"card":490},"34848583","Noya","A new kind of design tool","title","Show HN: Noya – A new kind of design tool","https:\u002F\u002Fwww.noya.io\u002Fhome","noya.io","dabbott",1676740217,2023,285,75,163,3109,6,"legend","dev_tools","design tool","web_app",[24,25,26,27],"wireframe to react","design system","low fidelity wireframes","react components","mixed",-0.005,{"positive":31,"neutral":32,"mixed":33,"critical":31},10,20,2,42,{"idea":36,"execution":37,"docs":40,"design":42,"pricing":43,"performance":44},{"positive":18,"critical":33},{"positive":38,"critical":39},1,3,{"positive":41,"critical":38},0,{"positive":41,"critical":38},{"positive":38,"critical":41},{"positive":41,"critical":33},[46,41,38,38,46,39,46,41,41,39,39,38,46,39,41,39,38,39,38,46,39,41,39,38,39,46,39,46,39,38,39,38,39,46,41,46,46,38,38,41],5,"Hi HN. I've been working on a new browser-based design tool that's ready for you to try.\n\nThe idea is you work on your design in low fidelity wireframes, while still getting a high fidelity output that you can share or use as a reference for your implementation. The way it works is by mapping low fidelity blocks you draw into high fidelity design system & React components.\n\nI spent several years working on design tools at companies like Airbnb, and I think the ideas behind many of the tools we built for designing at scale could really help startups and small teams as well. I would love any fee",{"problem":49,"audience":55,"pricing":62,"motivation":70,"time_to_build":74,"stack":75,"openness":91,"stage":92,"team_size":93},{"value":50,"source":51,"evidence":52},"Keeping design consistent from wireframe to high-fidelity output and code","maker",[53],{"id":54},"post",{"value":56,"source":51,"evidence":57},"Startups, small teams, founders, PMs, and engineers without dedicated designers",[58,59],{"id":54},{"id":60,"by":11,"text":61},"34850827","This is super useful feedback! I definitely want to support more design systems, including higher fidelity ones. I started with Chakra due to its popularity and simplicity, but…",{"value":63,"source":64,"evidence":65},"Professional tier around $10\u002Fmo mentioned by a commenter","commenter",[66],{"id":67,"by":68,"text":69},"34851922","jdauriemma","Looks amazing, I think the Professional tier seems like a great value in particular. I would absolutely pay more than $10\u002Fmo for this tool if UI design were part of my day-to-day.",{"value":71,"source":51,"evidence":72},"Bring design tool ideas from Airbnb to startups and small teams",[73],{"id":54},null,[76,80,87],{"value":77,"source":51,"evidence":78},"React",[79],{"id":54},{"value":81,"source":51,"evidence":82},"Chakra UI",[83,84],{"id":60,"by":11,"text":61},{"id":85,"by":11,"text":86},"34851531","Whoa, that was so long ago! There's a basic tailwind integration already - on some blocks you can write tailwind classes to style them e.g. #bg-red-500, #shadow. But the code…",{"value":88,"source":51,"evidence":89},"Tailwind CSS",[90],{"id":85,"by":11,"text":86},"open_source","beta","team",{"praise":95,"objections":116,"requests":164,"questions":203,"alternatives":229},[96,112],{"value":97,"source":64,"evidence":98},"Impressive demo and approach to wireframe-to-code",[99,103,104,108],{"id":100,"by":101,"text":102},"34850307","dhc02","This is so impressive. Reminds me of when I (a copywriter) would sit next to a great designer, saying \"try this\" and \"what about that\" and watching my nebulous feelings about the…",{"id":100,"by":101,"text":102},{"id":105,"by":106,"text":107},"34851041","clay_the_ripper","I have been waiting what feels like 10 years for a toolkit like this. Just signed up and will dig in more, but initially this is solving a lot of problems for me as an…",{"id":109,"by":110,"text":111},"34850474","vmatsiiako","Whoa!! I heard about Noya before, because we're in the same YC batch, but never seen a demo. Looks very cool what it can do. Great work!",{"value":113,"source":64,"evidence":114},"Fills a gap for small bootstrapped teams",[115],{"id":105,"by":106,"text":107},[117,128,135,142,149],{"value":118,"source":64,"evidence":119},"Code output not visible in the UI",[120,124],{"id":121,"by":122,"text":123},"34850432","swyx","hey cool demo! i just watched the video, one thing that is missing is for me to be able to see the output code. if you showed the code output at the end and it looked good i'd be…",{"id":125,"by":126,"text":127},"34854219","zmmmmm","Watched the whole video, scrolled end to end up and down, searched high and low could not find any detail about what code it generates. Generates a bit of an orange flag to me…",{"value":129,"source":64,"evidence":130},"Responsive layout relies on absolute positioning",[131],{"id":132,"by":133,"text":134},"34852581","eyelidlessness","> At the css level, \"top-level\" components are absolute positioned I’m not the target for this kind of tool, so please take this as a soft critique if any at all: everything up…",{"value":136,"source":64,"evidence":137},"Coupled to a specific React UI framework",[138],{"id":139,"by":140,"text":141},"34854914","no_wizard","My biggest complaint about these tools is they’re always React based, and in this case they made the choice of coupling to a specific React UI framework. Why not just generate…",{"value":143,"source":64,"evidence":144},"Constraints may block fine-tuning",[145],{"id":146,"by":147,"text":148},"34852728","jdthedisciple","Honestly looks amazing but my greatest fear with these sort of tools is that what often happens is the moment you wanna fine tune here or cut an edge there you're completely…",{"value":150,"source":64,"evidence":151},"Performance and refresh issues",[152,156,160],{"id":153,"by":154,"text":155},"34854700","FlashBlaze","Looks really really nice. But the page refreshed for me constantly after adding Click #dark. I'm on Windows 10, Firefox 109.0.1",{"id":157,"by":158,"text":159},"34852172","ArloL","FYI: Looking at the homepage and the video Firefox showed me a message that this website is slowing it down",{"id":161,"by":162,"text":163},"34852058","domlebo70","Works great. I am getting odd refreshes when using it however",[165,171,181,192,196],{"value":166,"source":51,"evidence":167},"Show generated code in the UI",[168],{"id":169,"by":11,"text":170},"34863633","Thanks for the feedback! - I think showing the code in the UI makes sense! - We definitely want to allow theme customization. I'm not sure exactly what that'll look like, but…",{"value":172,"source":51,"evidence":173},"Demo gallery and example forms",[174,177],{"id":175,"by":11,"text":176},"34850840","I love this idea! I'm going to try to have a demo gallery up by monday.",{"id":178,"by":179,"text":180},"34855229","cubano","So I am extremally disappointed that I just had a very poor interaction with your project. So I wanted to see how radios looked at work, but I completely unable to understand…",{"value":182,"source":64,"evidence":183},"More design systems such as MUI",[184,188],{"id":185,"by":186,"text":187},"34850427","rurabe","Looks so promising, what's the timeline for something like MUI?",{"id":189,"by":190,"text":191},"34850710","ar_turnbull","This is pretty cool! As a designer I can see the potential but the demo feels a bit simplistic — it might make a more compelling demo if you connected Noya to a higher fidelity…",{"value":193,"source":51,"evidence":194},"Theme customization",[195],{"id":169,"by":11,"text":170},{"value":197,"source":64,"evidence":198},"API to convert wireframes to React",[199],{"id":200,"by":201,"text":202},"34856957","anonzzzies","I would like an API I can feed wireframes (in json or something) to and get react back. Any plans?",[204,215,225],{"value":205,"source":64,"evidence":206},"What license applies and what is closed source",[207,211],{"id":208,"by":209,"text":210},"34855494","esperent","> PS: Most of Noya is open source at https:\u002F\u002Fgithub.com\u002Fnoya-app\u002Fnoya That's great to see. You're missing a LICENSE.md though, is it MIT licensed (as per package.json)? Also,…",{"id":212,"by":213,"text":214},"34857077","kinow","Someone created an issue about licensing: https:\u002F\u002Fgithub.com\u002Fnoya-app\u002Fnoya\u002Fissues\u002F372",{"value":216,"source":64,"evidence":217},"Whether the output is usable beyond a starting point",[218,222],{"id":219,"by":220,"text":221},"34850796","customaccount","No need for developers? Because this company is going to be the future haha",{"id":223,"by":11,"text":224},"34850934","With everything happening in AI I don't know if any job is safe lol. But at least for now, the code Noya outputs is just a starting point. A dev will likely still need to clean…",{"value":226,"source":64,"evidence":227},"Target user for the tool",[228],{"id":189,"by":190,"text":191},[230,234,241,248],{"value":231,"source":64,"evidence":232},"Figma",[233],{"id":105,"by":106,"text":107},{"value":235,"source":64,"evidence":236},"Framer",[237],{"id":238,"by":239,"text":240},"34852095","wx196","If you are targeting code generation, try Framer.",{"value":242,"source":64,"evidence":243},"Webflow",[244],{"id":245,"by":246,"text":247},"34852974","nbzso","As an experienced designer from the older generation, I have grown weary of the endless layering of software-as-a-service (SaaS) over SaaS, plugins, and extensions that has…",{"value":249,"source":64,"evidence":250},"Balsamiq",[251],{"id":105,"by":106,"text":107},{"comments":253,"answered":31,"key":254},24,[255,258,259],{"id":256,"text":257},"34851130","I really appreciate the thoughtful feedback. You described the problem extremely well - I might have to use some of those points when I talk about Noya! Honestly the current…",{"id":175,"text":176},{"id":260,"text":261},"34852107","Awesome! Lots of fun stuff is in the works :)",{"commenters":263,"max_depth":264,"maker_replies":253,"first_comment_mins":265,"lifespan_hours":266},44,4,134,96,[268,270,272,276,279,283,285,289,290,292,293,295,298,299,301,305,308,309,311,313,314,316,320,323,325,327,329,332,335,339,340,342,346,350,353,355,359,362,364,366,368,372,374,377,379,380,385,387,390,394,396,400,402,404,407,408,411,414,418,420,422,424,426,429,431,433,435,436,439,441,443,445,449,453,455],[105,41,46,269,106,41],"project\u002Fpositive\u002Fidea",[256,41,41,271,11,38],"maker\u002Fneutral\u002Fnone",[273,41,41,274,275,41],"34851303","commenter\u002Fneutral\u002Fnone","phphphphp",[277,41,41,274,278,41],"34855608","MrJohz",[280,41,38,281,282,41],"34851378","project\u002Fcritical\u002Fexecution","dmitriid",[238,41,38,284,239,41],"project\u002Fcritical\u002Fnone",[286,38,39,287,288,41],"34850786","project\u002Fneutral\u002Fdocs","Xeoncross",[175,38,41,271,11,38],[291,38,46,269,288,41],"34851851",[260,38,41,271,11,38],[146,33,39,294,147,41],"project\u002Fmixed\u002Fdesign",[296,33,41,297,11,38],"34853208","project\u002Fneutral\u002Fexecution",[100,39,46,269,101,41],[300,39,41,271,11,38],"34850366",[302,39,41,303,304,41],"34852549","other\u002Fneutral\u002Fnone","dannyeei",[306,39,41,307,11,38],"34852985","maker\u002Fpositive\u002Fnone",[189,264,39,294,190,41],[60,264,41,310,11,38],"project\u002Fneutral\u002Fdesign",[208,46,39,312,209,41],"project\u002Fneutral\u002Fnone",[212,46,39,312,213,41],[315,46,41,312,11,38],"34863693",[317,18,38,318,319,41],"34850781","project\u002Fcritical\u002Fidea","itronitron",[321,18,41,322,11,38],"34850868","maker\u002Fneutral\u002Fidea",[324,18,46,269,319,41],"34850971",[121,326,39,312,122,41],7,[328,326,41,271,11,38],"34850442",[245,330,41,331,246,41],8,"other\u002Fneutral\u002Fidea",[333,330,41,303,334,41],"34862267","lukasfischer",[336,337,39,312,338,41],"34862436",9,"selfportrait",[169,337,41,271,11,38],[178,31,38,341,179,41],"project\u002Fcritical\u002Fdesign",[343,31,39,344,345,41],"34855295","maker\u002Fneutral\u002Fdocs","daverecycles",[347,348,39,312,349,41],"34898421",11,"schkolne",[125,351,38,352,126,41],12,"project\u002Fcritical\u002Fdocs",[354,351,39,287,345,41],"34854370",[356,351,39,357,358,41],"34855455","maker\u002Fneutral\u002Fexecution","haxton",[67,360,46,361,68,41],13,"project\u002Fpositive\u002Fpricing",[363,360,41,271,11,38],"34852015",[185,365,39,312,186,41],14,[367,365,41,271,11,38],"34850463",[369,370,41,303,371,41],"34850176",15,"blowski",[373,370,41,310,11,38],"34850315",[375,370,39,310,376,41],"34851013","onethought",[378,370,41,271,11,38],"34851077",[132,370,38,281,133,41],[381,382,39,383,384,41],"34850147",16,"project\u002Fneutral\u002Fidea","zol",[386,382,41,271,11,38],"34850224",[388,382,46,389,384,41],"34850269","project\u002Fpositive\u002Fnone",[391,392,39,297,393,41],"34853337",17,"monroewalker",[395,392,39,357,345,41],"34853711",[397,398,39,312,399,41],"34853339",18,"insky2",[109,401,46,389,110,41],19,[403,401,41,271,11,38],"34850517",[405,32,39,312,406,41],"34851473","thawab",[85,32,41,297,11,38],[153,409,38,410,154,41],21,"project\u002Fcritical\u002Fperformance",[412,409,39,413,345,41],"34854745","maker\u002Fneutral\u002Fperformance",[415,409,39,416,417,41],"34869575","project\u002Fneutral\u002Fperformance","stoicjumbotron",[157,419,38,410,158,41],22,[421,419,41,413,11,38],"34852213",[200,423,39,383,201,41],23,[425,423,41,271,11,38],"34863643",[427,253,46,269,428,41],"34851083","MoSattler",[430,253,41,303,11,38],"34851142",[432,253,41,303,133,41],"34852520",[219,434,46,269,220,41],25,[223,434,41,297,11,38],[161,437,46,438,162,41],26,"project\u002Fpositive\u002Fexecution",[440,437,41,357,11,38],"34852099",[139,442,38,281,140,41],27,[444,442,39,271,345,41],"34855012",[446,447,38,318,448,41],"34852510",28,"junglistguy",[450,447,41,451,452,41],"34852620","commenter\u002Fcritical\u002Fidea","imiric",[454,447,41,269,11,38],"34852749",[456,447,41,303,457,41],"34854696","moneywoes",[],[460,464,469,473,478,483],{"id":461,"name":462,"points":463,"category":20},"34869244","PyGWalker",712,{"id":465,"name":466,"points":467,"category":468},"34897773","AskHN",612,"ai",{"id":470,"name":471,"points":472,"category":20},"34897645","highlight.io",408,{"id":474,"name":475,"points":476,"category":477},"34826085","Basement Community",373,"consumer_social",{"id":479,"name":480,"points":481,"category":482},"34881286","Yobulk",233,"data",{"id":484,"name":485,"points":486,"category":487},"34901481","Jotte",212,"creative",false,"v2",{"id":491,"name":5,"line":6,"ai":488,"cat":20,"year":13,"points":14,"comments":15,"rec":28,"s":41,"top":18,"kw":492,"maker":11,"domain":10,"tier":19,"attempts":41,"strip":493,"url":9,"mix":494,"praise":97,"objection":118,"sub":21},34848583,[24,25,26,27],"5011535003315303131530313535313135055110",[31,32,33,31],1793991060546]