Skip to content

Week 03. Computer Aided Design

This week, I went through the Markdown Tutorial and got some new tips about Markdown codes. Also, I figured out how to use Git to pull the remot repository to my local ones as well as push my local repository updates to the web: thanks to the wonderful Sourcetree! I also learnt to change the accent color and primary color of my website. So I updated it to a “violet” theme :) I found a very beautiful html5up template, but I did not know how to use it yet. Will figure it out later :)

What’s more, I learnt about many many tools in Computer Aided Design, including tools for 2D drawing, 3D design, editing images, audio and video. With so many tools available, it’s actually not easy to choose. I tried a few tools and still haven’t decided which ones will become my long-time friends along my journey at Fab Academy 2019 and beyond yet.

GIMP


Gimp Mascot, Image Credit: Gimp

The first tool I tried was GIMP, a free and open source tools for platforms including Linux, Windows and MacOs. It has a a very cute mascot: Wilber, with two big eyes and a brush in its mouth, which reminds me of Chinese calligraphy :)

Since there is a dmg file of Gimp available on its website. I can download and install it on to my laptop directly, very straight-forward. I followed the following Youtube tutorial to learn the basics of Gimp.

First of all, I got a better understanding of the difference between Vector and Bitmap. - Vector: the quality of the image won’t be affected when we change the dimension of the file. - Bitmap: the image will lose quality easily. That’s why we need its vector file when project the image in large screens or print it out as posters etc. It’s easy to convert vector files into bitmap files, but not easy to convert bitmap files into vector.

Some of the take-aways that I can apply into real-life directly are: - I can change the size of the images, making it suitable for web and yet do not compromise the image quality. This will be useful especially when I update my website at Fab Academy 2019. - I can modify the images, using the basic functions of Gimp including change the balance, the lighting & exposure etc. Hopefully I won’t have to bother my colleague to help me modify photos in the future. In order to prove that this is working. I tried editting a photo taken during an SDG meetup at Chaihuo x.factory in January. The original photo was too dark, and I decided to use Gimp to make it better.
the original image


updated image

I did it by following this Youtube instruction by Michael Davies. I did not go through all details & tips introduced in this video this time. It will come very handy especially when I need to change background of my profile photo for different documents.

I don’t think I can master Gimp with a few videos. With the tools available, I will need to practise a lot of times to harness the skills. Practice makes perfect. There is still a long way to go.

MyPaint


MyPaint Logo, Image Credit:MyPaint
My experience with MyPaint was way more challenging than Gimp. Since MyPaint doesn’t have a ready-to-install dmg. file for MacOs, I had to go throug a lenthy process to install it on my MacBook Air. First of all, I saw that I can downloading MyPaint via MacPorts is very very troublesome, so I searched for another alternative - Homebrew. I found this post and tried its code to use Homebrew to install MyPaint directly. However, it did not work.

(image: Homebrew install MyPaint - failed)

Then I followed this instruction on this Youtube link to install MyPaint. - 1. download and install Xcode
- 2. install the update of “Commind Line Tools” - I skipped this part because I already have the updated Command Line Tools.
- 3. install macports
- 4. install XQuartz
- 5. install MyPaint
After everything was installed, it still did not work either. The MyPaint app crashed whenever I clicked it.
(image: MyPaint did not work)

And I searched for solutions. I found out a simple solution with the following code: 

brew install libmypaint

I did not know whether this line of code was the right code to use Homebrew to install MyPaint, or it helped debug my previous actions, or maybe I did not do it the right way. I still couldn’t use MyPaint by clicking the App, but by writing “mypaint” directly on my terminal, and MyPaint was open via XQuartz. I couldn’t undo what I did previously, so there are still many question marks in my head about installing MyPaint on MaxOs. What’s more, whenever I open MyPaint on my terminal, it showed this error.
ERROR: mypaint: No platform-specific fallback for locating bindtextdomain is known for ‘darwin’


(image: MyPaint error)

And the good news is I can use MyPaint now! What’s more Xcode & XQuartz proved to be very useful later when I install other software on MacOs.

I happily doodled a random “masterpiece” :D


(Violet’s colorful MyPaint Doodle :D)

Inkscape


Inkscape Logo, Image Credit: Inkscape
The previous lenthy process of installing MyPaint actually helped pave the road for Inkscape. With Xcode, XQuartz and MacPorts successfully installed. I can install Inkscape with a simple code:

sudo port install inkscape

I took quite a while, but it’s a very relaxing process - I listened to two talks on Youtube while waiting for Inkscape to be installed. :D
The 3 links for “Elements”, “Basics” & “Shapes” on the FabAcademy Tutorial for Inkscape showed error “Page Not Found”. So I decided to follow the tutorials on the video of Fab Academy 2015: Lecture 02 Inkscape to learn the basics of Inkscape and later follow the turtorials on Inkscape.org to learn how to use Inkscape.

I started to learn Inkscape following the tutorials. Some people might prefer video tutorials. However, after watching a few video tutorials I found it difficult to follow: on the one hand, it’s not easy to see where the instructors click as the tabs/buttons are small; on the other hand if I watch it fullscreen, I couldn’t follow the instructions after watching the whole video. Hopefully, the text tutorial will be suitable for me.

I didn’t use mouse for 4+ years and now following the tutorials I realized a mouse will make it easier for me to control & make 2D designs. So, I need get a mouse first. Also, the tutorials seems to aim for Windows users, and some of the keys are not right for MacOs, so I need to figure out which ones work and which ones do not. And for those shortcuts that do not work on MacOs, I will use the tabs/items on the app directly for now.

Some useful shortcuts:

Item Shortcuts Description
1 Ctrl+B how/hide the scrollbar
2 Wheel scroll vertically
3 +/=, Ctrl+mid/right click zoom in
4 -, Shift+mid/right click zoom out
5 Ctrl+Z undo the last action
6 Shift+Ctrl+Z redo the undo
7 Ctrl+A select all objects(the same layer)
8 Esc deselects
9 Shift+click exclude objects from selection
10 Ctrl+G create a group
11 Ctrl+U to ungroup
12 Ctrl+click edit an object within a group
13 Shift+Ctrl+click multiple select regardless of groups
14 Ctrl+D duplicate the selected objects
15 Shift+Ctrl+A align the selected objects

With the basic knowledge of how to use Inkscape, I started to build the surface of my final project. As I am terrible at drawing and I did not know what shape should my final project take yet. So I only draw a basic round service, with the following elements:
- a round shape of the machine frame
- 26 letters in the sequence & location as a keyboards
- two holes for putting mallets
- a big screen (When the player hits the letters with the mallet, the letters will be displayed on the screen.)


(the 2D initial design of the surface)

Since it’s our Spring Festival holiday now, and our Fab Lab won’t be open before Jan 11th. I am not sure whether this file is ready to use with a laser-cutter or not. Will check it after coming back to the office :)

And here is my first 2D design file for downloading.

After further learning to use Inkscape, I realized the previous design won’t be valid for cutting because the keyboard part (with letters on it) can’t not be recognized by the laser cutter. I need to convert the letters into paths. So I updated the design, see the following screenshot of the design.


(updated 2D design)

And here is the dxf. file for downloading.

FreeCAD


FreeCAD Logo, Image Credit: FreeCAD

FreeCAD is an open-source CAD tool, which it is said is becoming more and more popular and power in 2D and 3D design. I am happy to find out that FreeCAD has a dmg. file ready for MacOs users to download and install directly.

In the previous session I spent almost 4 hours in learning the basics of Inkscape, and then I was thinking it might not be necessary to go through all the details. When it came to FreeCAD, I did not know where to move my cursor, where to click, did not know anything about how to start with. It seemed it IS necessary to learn some basics before jumping into creating.

I found a few tutorials online but it all seemed like #%^@&#$%^ (not-understandable) to me. Like I mentioned earlier, I did not know where to click, which part of the mouse works which way etc. And Luckily I found this tutorial by Bram de Vries which is the best I could find. And I made the first 3D design following his tutorial. This is the first yet happy step for me.

Puzzles that were solved in this process:

creating & editing primitives

  • right click the object => choose “touchpad navigation” => alt+moving mouse to view the object from different angles.
  • to rotate an object: click the object => change the axis value (x, y, z) + change the angle value => done.

subjecting and combining primitives

  • to subject primitives: click one object => press Alt + click the next object => click the icon of “make a cut of two shapes”(this icon shows a a blue circile on left corner & white circle on the right upper corner). If I choose the cube first and the cylinder later, it will cut a hole on the cube; and if I choose the cylinder first and the cube later, it will cut the cute out and leave two shorter cylinders.


(cut a hole)


(cut, make two shot cylinders)

  • even though after the cut, the cylinder is invisible, it’s still there. I can click “cylinder” at the left column and change the values to change the design.
  • click “cut”, delete it to undo the “cut”.
  • to joint two shapes: click two objects, click “make a union of several shape” (this icon shows as two circles interlinked).

    (make a union)

creating 2D sketches

  • choose “part design” workbench => sketcher (or select “sketcher” directly from the workbench).
  • select the icon (shows as a vertical zigzag) to creat a sketcher.
  • click a certain line, click | to make it vertical.
  • click “both-side-arrow” icon to define the length of each line.

from 2D sketch to 3D model

In this process I learnt the following functions:
- “pad” & “pocket”
- ”create an edge link to an external geometry”
- “through all” - change the values of the “sketch” to change the size/dimension of the whole object.
- change the values of the “pocket” to change size/location of the hollow hole.

Some other small tricks: - when make chamfer at “part” workbench, you could not change its value; when make from “part design” workbench, you can change the size of it.
- when use “trim an edge” function, sometimes it will trim the part that you do not mean to trim, use “Ctrl+Z” to undo it, and try trimming some other parts first (it seems the sequence matters).

After following a few basic instructions, I felt like I can begin drafting my own 3D design. I do not know how 3D design will help in my final project yet. So I decided to make a 3D design of a little table.

A Small Table by Violet.Su on Sketchfab

_

There were so many tools to learn this week. I did not manage to learn anyone in depth, nor do I manage to get hands on the tools in the following categories:
- interchange formats
- game engines
- simulation
- audio, video editing

I decided to focus on 2D & 3D design for now. I think at this current stage I need to figure out how to do 2D & 3D design, so that I can get a rough structural design for my final project. Another thought was as a person who is really poor at drawing/painting, will the Compueter Aided Design tools be able to help me improve the aesthetic part of my projects? Stay tuned and see what I can come up with as time passes by.