[{"data":1,"prerenderedAt":268},["ShallowReactive",2],{"project-2420221":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":27,"sentiment":28,"stance_mix":29,"scored_comments":18,"aspects":33,"strip":40,"post_text":43,"what":44,"said":55,"maker_in_thread":160,"shape":170,"grid":174,"attempts":229,"same_week":230,"maker_shows":30,"maker_hidden":260,"reader_version":261,"card":262},"2420221","Patternify","A CSS Pattern Generator","title","Show HN: Patternify, a CSS Pattern Generator","http:\u002F\u002Fwww.patternify.com\u002F","patternify.com","sgdesign",1302195689,2011,74,24,164,1097,15,"notable","dev_tools","css pattern generator","web_app",[21,24,25,26],"css background","base64 css image","pixel pattern editor","mixed",0.097,{"positive":30,"neutral":31,"mixed":32,"critical":32},4,7,2,{"design":34,"idea":37,"execution":38,"docs":39},{"positive":35,"critical":36},1,0,{"positive":32,"critical":36},{"positive":36,"critical":32},{"positive":35,"critical":36},[41,41,42,42,36,41,42,36,36,41,36,41,36,41,36,41,41,36,35,36,41,36,42,35],3,5,null,{"problem":45,"audience":43,"pricing":43,"motivation":43,"time_to_build":43,"stack":52,"openness":53,"stage":54,"team_size":53},{"value":46,"source":47,"evidence":48},"Creating repeating background patterns for websites without an image file.","maker",[49],{"id":50,"by":11,"text":51},"2420280","A small app I've been working on these last few days. It's a simple pattern generator, and you can export your pattern as a PNG, or as base64 code. If you export it as code, you…",[],"unknown","prototype",{"praise":56,"objections":77,"requests":107,"questions":143,"alternatives":148},[57,66],{"value":58,"source":59,"evidence":60},"Useful, especially the base64 export for pasting straight into CSS.","commenter",[61,65],{"id":62,"by":63,"text":64},"2420301","sunetos","It's useful (especially the base64 part), but I didn't see any way to actually \"generate\" a pattern. Maybe call it a CSS Pattern Editor? Also, it would be easier to use if…",{"id":50,"by":11,"text":51},{"value":67,"source":59,"evidence":68},"Fun, simple pixel-drawing interface.",[69,73],{"id":70,"by":71,"text":72},"2420567","handsomeransoms","This is great! Had fun playing with it for 10 minutes. A UI note: a common behavior in pixel-based editors like this one is: When you click on a blank pixel, fill it with color.…",{"id":74,"by":75,"text":76},"2420875","alanfalcon","This reminds me of the old days of creating desktop \"wallpapers\" on my Mac 512K. Except this allows color! I've found one fun way to generate patterns (for websites, for…",[78,88,93,100],{"value":79,"source":59,"evidence":80},"Clicking a pixel clears it instead of painting over, which is awkward.",[81,85],{"id":82,"by":83,"text":84},"2420762","moeffju","Minor nitpick: When I click a pixel of a different color than my current color, I would expect to paint over the pixel, not clear it first. That would also make it much easier to…",{"id":86,"by":83,"text":87},"2420957","Clicking a pixel again (same color) would delete it, in lieu of an eraser tool. That would shift the burden of clicking twice to get your desired result to when you were deleting…",{"value":89,"source":59,"evidence":90},"Drawing needs click-and-drag painting instead of repeated clicks.",[91,92],{"id":70,"by":71,"text":72},{"id":62,"by":63,"text":64},{"value":94,"source":59,"evidence":95},"Does not work on iPad because the drawing area ignores touch.",[96],{"id":97,"by":98,"text":99},"2421377","mryall","Almost all the controls at the bottom worked on the iPad but clicks in the drawing area didn't. I found it impossible to draw any pixels on. Perhaps I misunderstood how it is…",{"value":101,"source":59,"evidence":102},"Needs a .png extension added manually when exporting.",[103],{"id":104,"by":105,"text":106},"2421270","drivebyacct2","'Don't forget to add the .png extension to the file' ... what? Why is this not automatic? (Oh, this is being generated client side maybe? thus it's a browser\u002Fhtml5 limitation I'm…",[108,119,129,136],{"value":109,"source":59,"evidence":110},"Add sample patterns to start from.",[111,115],{"id":112,"by":113,"text":114},"2420496","melissamiranda","Would be amazing to have a few sample patterns as a way to show how it works (what to paint). Would help newer designers figure out how to make good-looking patterns and provide…",{"id":116,"by":117,"text":118},"2420939","mrtron","Nice! I would have it default to a nice looking pattern first to show it in use. Then a clear button would be useful. And finally I agree the drawing is annoying - just have them…",{"value":120,"source":59,"evidence":121},"Add an eraser or Shift+click to delete pixels.",[122,125],{"id":123,"by":11,"text":124},"2420889","Yeah, I realized this too while using it. But then how would you delete a pixel? I would need to add an eraser tool, which means I need to rethink some of the UI, etc. So I…",{"id":126,"by":127,"text":128},"2421665","moe","Make it so Shift + Click deletes. Problem solved.",{"value":130,"source":59,"evidence":131},"Add a color palette or eyedropper and a clear button.",[132,135],{"id":133,"by":11,"text":134},"2420995","But since there's no color palette or eyedropper, finding the same exact color is virtually impossible… so right now the way that you describe wouldn't really work. And the…",{"id":116,"by":117,"text":118},{"value":137,"source":59,"evidence":138},"Make the background change to show the pattern in use.",[139],{"id":140,"by":141,"text":142},"2420338","vinhboy","Instead of doing it in the little box, you should make it change the entire background (instead of the orange). More visual that way.",[144],{"value":145,"source":59,"evidence":146},"Is the export generated client side, which is why the file extension is needed?",[147],{"id":104,"by":105,"text":106},[149,156],{"value":150,"source":59,"evidence":151},"Pixelfinger, an iPhone\u002FiPad pixel sketching app.",[152],{"id":153,"by":154,"text":155},"2422014","minikomi","Had a similar idea for iPhone\u002FiPad pixel sketching... http:\u002F\u002Fsouseiji.net\u002Fpixelfinger You can share them too: http:\u002F\u002Fbit.ly\u002FbIkGnu",{"value":157,"source":59,"evidence":158},"Colourlovers pattern collection.",[159],{"id":74,"by":75,"text":76},{"comments":161,"answered":32,"key":162},6,[163,166,169],{"id":164,"text":165},"2420976","Yes, that's a great idea. I'll definitely add a couple sample patterns to it soon.",{"id":167,"text":168},"2420971","I used to love all the little patterns that came on old Macs! I should try to recreate them with Patternify actually…",{"id":50,"text":51},{"commenters":171,"max_depth":42,"maker_replies":161,"first_comment_mins":172,"lifespan_hours":173},17,13,20,[175,177,180,184,186,188,190,191,192,194,196,199,200,202,203,204,205,207,210,213,215,219,223,228],[140,36,41,176,141,36],"project\u002Fneutral\u002Fdesign",[178,36,41,176,179,36],"2421069","moggie",[181,36,42,182,183,36],"2421108","project\u002Fpositive\u002Fdesign","Tyrant505",[112,35,42,185,113,36],"project\u002Fpositive\u002Fidea",[164,35,36,187,11,35],"maker\u002Fpositive\u002Fidea",[70,32,41,189,71,36],"project\u002Fneutral\u002Fexecution",[74,41,42,185,75,36],[167,41,36,187,11,35],[50,30,36,193,11,35],"project\u002Fneutral\u002Fidea",[62,42,41,195,63,36],"project\u002Fmixed\u002Fexecution",[197,42,36,198,11,35],"2420327","maker\u002Fneutral\u002Fidea",[82,161,41,189,83,36],[123,161,36,201,11,35],"maker\u002Fneutral\u002Fdesign",[86,161,41,176,83,36],[133,161,36,201,11,35],[126,161,41,176,127,36],[116,31,41,206,117,36],"project\u002Fmixed\u002Fdesign",[153,208,36,209,154,36],8,"other\u002Fneutral\u002Fnone",[97,211,35,212,98,36],9,"project\u002Fcritical\u002Fexecution",[214,211,36,209,154,36],"2422023",[216,217,41,193,218,36],"2423476",10,"pbhjpbhj",[220,221,36,209,222,36],"2420497",11,"ams6110",[224,225,42,226,227,36],"2421019",12,"project\u002Fpositive\u002Fdocs","dustingetz",[104,172,35,212,105,36],[],[231,236,241,246,251,255],{"id":232,"name":233,"points":234,"category":235},"2441888","SalaryShare",278,"web_saas",{"id":237,"name":238,"points":239,"category":240},"2440732","objc-ycomb",97,"languages",{"id":242,"name":243,"points":244,"category":245},"2443088","tech3some",39,"finance_crypto",{"id":247,"name":248,"points":249,"category":250},"2437248","ReVisualizer",35,"data",{"id":252,"name":253,"points":254,"category":235},"2418388","Babolog",33,{"id":256,"name":257,"points":258,"category":259},"2419247","Ingredient Pairings",25,"productivity",false,"v2",{"id":263,"name":5,"line":6,"ai":260,"cat":20,"year":13,"points":14,"comments":15,"rec":27,"s":264,"top":18,"kw":265,"maker":11,"domain":10,"tier":19,"attempts":36,"strip":266,"url":9,"mix":267,"praise":58,"objection":79,"sub":21},2420221,0.1,[21,24,25,26],"335503500303030330103051",[30,31,32,32],1794036487636]