2. Computer Aided design¶
This week I worked on making a 3D mockup of the interface for the video synth.
Assignment: model (raster, vector, 2D, 3D, render, animate, simulate, …) a possible final project, compress your images and videos, and post it on your class page.
Here are my 2D files from this week:
And my 3D rhino and Fusion files:
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Rhino 3D: 3D design¶
I have been using this proogram for a while now. Rhino is a NURBS modeler that is good at modeling curvy surfaces https://www.rhino3d.com/. It is popular with architecture students, in part because of the power of the Grasshopper plug-in which allows for parametric modeling https://www.rhino3d.com/6/new/grasshopper/.
I first defined a box to represent roughly the size of the object (150mmx100mmx50mm) as I imagine it.
I then downloaded an existing knob (https://grabcad.com/library/potentiometer-knob-05-1) in STL format from the site Grab Cad.
I next created a curvy surface by creating three Bezier (control point) curves, seperating them in X space, and then using the Loft command to interpolate a NURBS surface between them. I am roughly trying to make a surface that looks like a patch of ocean.
I then subtracted this surface against the initial volume I had made using the BooleanDifference command.
After modeling a cylinder (I decided against the realistic knob for this initial prototype) I used the ArraySrf command to position an array of the cylinder object and orient it based on the surface normal at that position on the surface.
This took a second attempt to get the density of the array right…
I added some wires using the Pipe command and changed the layers to different colors.
It occured to me that this design wasn’t very ergonomic - though the idea of a purposely unergonomic design isn’t totally off limits for me - so I inverted the design.
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Rhino 3D: 3D Rendering¶
I switched into render preview mode and selected some basic colors for the different objects.
I added some 3D text for the name of the machine (I went with the french for oceanic, in reference to the wave surface).
I put the tiny indicators of the knobs on a seperate layer and gave it a different color for the rendering. (It’s the details !)
I am using default Rhino renderer, matt plastic materials of various colors, and the default sun position:
And here are the top and elevation views:
And finally a zoomed in side elevation:
Here is the 3D model to check out:
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Fusion 360: 3D design¶
I first made a rectangle of the same dimensions as in Rhino:
…and now extruded:
I then began boolean subtracting various platonic forms:
…cylinders and a torus:
To end up with a funky landscape:
I then added knobs using the cylinder command:
After this I added the input and output wires using the Pipe command after I made my curvy line sketch:
To add the extruded text I made a text sketch and then extruded it on one face:
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Fusion 360: 3D Rendering¶
I first quickly inspected the surface continuity to have an idea of what to expect from the rendering:
Hovering over the model icon I selected Render. I first added a gold metal material to the model and picked a perspective for the image:
I selected to render locally and for a JPEG image that wasn’t too big:
I like the shiny metal texture!
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
OpensCAD: 3D design¶
I’m going to try to parametrically model a knob in this program (similar to the one I downloaded from GrabCAD) while screen recording.
I’m referring to the manual here: https://en.wikibooks.org/wiki/OpenSCAD_User_Manual#Introduction
Here is the very basic know with set screw and indicator I developed. I am using rotate, translate and difference.
//knob
//knob variables
BottomRadius=5;
TopRadius=4;
height=7;
difference() {
difference() {
translate([0,0,1]) cylinder(h = height, r1 = BottomRadius, r2 = TopRadius, center = true/false);
cylinder(h = height-1, r1 = TopRadius-1, r2 = TopRadius-1, center = true/false, $fn=100);
}
rotate(a=[90,0,0])
translate([0,5,2])
cylinder(h = 3, r1 = 1, r2 = 1, center = true/false, $fn=100);
}
//set screw
//set screw variable
allen=6;
difference() {
rotate(a=[90,0,0])
translate([0,5,2])
cylinder(h = 3, r1 = 1, r2 = 1, center = true/false, $fn=100);
rotate(a=[90,0,0])
translate([0,5,3])
cylinder(h = 2.1, r1 = .5, r2 = .5, center = true/false, $fn=allen);
}
//indicator
translate([0,2,height+1]) cube([1,3,1],true);
I really like this program and want to dedicate more time to making forms with loops etc.
For the screen recording I am using Screenpresso (I tried Kdenlive and couldn’t find the record screen function after trawling the fora online) and for the compression and editing I am using Adobe Premiere.
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Illustrator: 2D interface design¶
Here is a test in Illustrator of a more realistic synth interface with text and a variety of things to play with. I am using the circle, rectangle, text, and curvy line commands.
It occured to me after making this first prototype that a great deal of what a synth can do is thanks to the patch cords, and switches - not just knobs. In order to do a few more interface design tests in Illustrator, I used the Contour command in Rhino to get a series of vector contours of the 3D surface that I plan to use in top view. I am exporting in .ai.
I imported to contour in top view into Illustrator:
I scaled non-uniformly the plug objects based on the contour to make a quick sketch of how the synth would look if the objects followed the slope of the landscape. The jumpers are just bezier lines with added thickness.
The knobs are circles combined with rectangles and I added little white indicator points which were rectangles.
The sliders are just made from using the rectacle tool.
The switches are composed of circles with rounded rectangles.
I added text (I love this Proxy font) and distorted it with the transform tool if it was written on a slope. I added wires coming out from one side as well.
The hand is a raster bitmap that I mirrorred and scaled to give an idea of the scale of the object.
During this exercise I discovered that I could either impose a grid on the changing surface or have my buttons etc. follow contour lines. You can also have fun with the naming, for instance the little dip I named the Uncanny Valley.
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
Inkscape: 2D interface design¶
I started off drawing a video tape deck (I’m hoping I can get my hands on one of these so that I could ‘live mix’ video inputs):
Instead of describing logic operations with text I decided to have graphical representations of AND, OR, NAND, etc. I used the boolean commands in Inkscape to make this.
I added a selections of masks here, they could be useful for superposing images in different ways:
A visual description of different waveforms available for the oscillators:
The horizontal and vertical sync sliders would allow the user to distort the image in X and Y.
I don’t have a great solution for the clip selection, so for the moment here is a big knob that could select up to 100 clips.
I’m not sure yet how to integrate the various effects I would like to make available. Here is just a list with a botton beside each option. Below is a final version of this iteration. I added 8 bit dip switches to make the selections of the maks and boolean operations.
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
MODS: 2D test drive¶
I took the community version of MODS for a quick spin here. I wanted it to take in a PNG as input and output a toolpath for a milling machine for instance.
I was at first confused why MODS wasn’t taking my PNG as input and outputing a tool path…
…but then I realized that I didn’t give it any path input. I found the edge selection tool and used this to detect the edges of the image file and output a path as output. The patch successfully output a G-code file and I can vary the parameters of the milling operation (offset, etc.).
And here is the toolpath visualization:
I found the viewer modules very useful to see what was going on key steps. It would be cool if MODS could warn you when one of the inputs isn’t good or if the module needs more inputs before it can function (but perhaps it does do this and I just haven’t understood the message).
Attribution CC BY
