Tag Archives: tool

idea: open fashion design tool

My partner is showing me the ropes (threads) of designing and making clothes. I’m not a fan of shopping for clothes; I don’t think I’ve ever seen something in a store and thought “this is so me.” The things that I design and make for myself quickly become my favorites.

3d fab
The most practical, economical, and accessible machines for 3D fabrication.

As a bonus, sustainable/recycled materials to feed into the machine are really easy to find. Designs can be easily ripped and remixed from anything that you have that fits well. The design and fabrication process is tactile, and quite forgiving.

Fashion pattern design is essentially low-polygon 3D modeling, with constraints for body measurements.

There are general purpose tools for pattern design that look cool, but they wouldn’t even tell me the price. They are not interested in the DIY community.

Continuum Fashion’s D.dress is impressive, drawing shapes to generate the triangles needed to sew that 3D form. But the output is more of a New Aesthetic experiment than practical clothing. Their Constrvct project outputs more everyday-friendly designs, but only for women, and they keep control of the pattern and production steps.

I’d really like to use a design tool that lets you:

  • start with time-tested standard patterns, and customize from there
  • tweak any of the pieces or constraints
  • see a live-updating 3d preview
  • specify fabric type / weight / stretchiness
  • use a projector to transfer your pattern directly onto cloth (printing paper patterns is annoying)
  • add colors, photos, or patterns (these could be printed with the lines to cut directly on the cloth with services like Spoonflower)

Getting measurements and building on a Kinect-scanned 3D model of yourself would be a fun stretch goal. (Though taking measurements might be a little less invasive than stripping down for a Microsoft camera.)

It should obviously be Free, open-source, and available to anybody with a web browser.

What are the technical pieces that I need to put together to make this tool?

  1. Bret Victor’s Drawing Dynamic Visualizations shows a well-considered UX for constraint-based vector design. This line = 1/2 (waist circumference + breathing space).
  2. Then we need some way to specify which lines are sewn together, and in which order. (Order of sewing is really important and still somewhat magical to me. But I’m starting to see the logic in it.) The live 3D visualization will help there.
  3. To turn the polygons into a cloth-like 3D shape, we’ll need to triangulate and subdivide them into many smaller triangles. Each line in this mesh will want to keep it’s length, but will stretch as much as cloth allows.
  4. When we “sew” those polygons together, we need some way to inflate the model. This demo of a force-directed graph layout algorithm illustrates how this might work.
  5. 3D rendering the calculated meshes, probably with Three.js.

The implications of reimagining production chains have been explored by the folks behind Matter Machine. I’ll expand on those ideas in a future post, but I’ll just say that I think it could be a good thing.

So far, this project is only a collection of conversations, sketches, and this blog post. If you’re interested in joining, or have some pointers, please leave a comment or get in touch.

Edit 02/23: Trying to express the low-level question of designing a UI for constraint-based vector drawing, I made this diagram for a friend:

The long-tail of tool design and transformative programming

Simon St. Laurent connects some conceptual components in Transformative Programming: Flow-based, functional, and more. He explains the connections between web services, punch cards, Unix pipes, functional programming, and flow-based programming. I have been thinking about these connections for some time, and I’m glad somebody articulated them.

After years of watching and wondering, I’m starting to see a critical mass of developers working within approaches that value loose connections. …they share an approach of applying encapsulation to transformations, rather than data.

I think that people want tools to solve problems. It is amazing to see the lengths that computer novices will go to get the wrong tools to do what they want. (I talked about this in my JSConf.eu talk this year. It isn’t on YouTube yet, so I have no idea how coherent I was.)

If we make it easier to stitch together minimal tools, then we could make our own environment for different kinds of tasks. Wire in a spreadsheet when we need tabular data, timeline when we have linear media, dataflow graph when we want to make A/V synthesis and filtering… building software should be the practice of recognizing how to stitch these components together.

More people should have this skill. My main research interest is in making this skill (really, superpower) more accessible. I want to do this for myself, but also for my parents, kids, friends, and myself as a 9-year-old.

Monolithic software suites try to solve every problem in a broad domain with a giant toolbox, and then get abused to solve problems in other domains. Photoshop isn’t a web design tool, and it isn’t a dynamic web/mobile app design tool, but it is bent to solve those problems. Toolboxes are useful things to have and understand, but every digital media challenge is different.

meemoo-illo-by-jyri-pieniniemi I think that the upcoming custom elements web standard + NoFlo is going to be a powerful combination to make tools to get stuff done. I agree with St. Laurent that making the high-level picture dataflow is an effective way to make this work. My Meemoo.org and Mozilla App Maker are two potentially-compatible concepts for building toy programs like this. NoFlo is bringing this method to general purpose JavaScript, which now includes many spheres of possibility: server, browser, audio, video, 3D.

At JSConf.eu Jason Frame demoed a prototype window manager made for slicing up a screen and stitching together tools like this, using dataflow wires to connect widgets. I imagine a system like that which can also zoom in (open up?) to make more complex logic in a NoFlo graph.

This is the long-tail of tool design. 5 billion people will come online for the first time in the next 10 years. What problems will they be interested in solving? How many of these problems will be too obscure or not profitable enough to be suitable for a company to attempt to solve?

Right now, today, we can’t see the thing, at all, that’s going to be the most important 100 years from now.
Carver Mead


St. Laurent also writes about “Humans as Transformers.” Lauren McCarthy made a project where she farmed out all decisions during some dates to strangers on the internet in real-time. This got me to imagine a “Mechanical Turk” component for NoFlo: inputs data, text for directions, and price per item processed; outputs the human-transformed data. You could run these in parallel to compare answers, and use NoFlo’s normal flow controls to handle the asynchronous nature of the component. This would be a quick and dirty way to encapsulate any programming challenge too complex or difficult to express in code.