Hi.I’m Moraa, a student at Fablab Winam, and I’m delighted to be here, thoroughly enjoying the class.
Hello. My name is Beryl Kerubo. I'm passionate about tech.
Yes! Please participate if you feel inspired. As you can see below, we're also working with a community maker space in Kisumu Kenya called the Winam Fablab. Several of their instructors and students will joining in on the project as well.
Welcome everyone. Fablab Winam looks like fun.
All these designs are actually so cool :0
Great job to everyone! X3
Great post! The result is wonderful, but there are probably a few changes I would change to the way the code is structured to better align with best practices.
If we look at your second two custom blocks (below), we can see that you're using them to both position and draw the internal grids.
I'm going to break this down into subroutines. If you want to move the turtle this way, I would stay consistent with naming conventions. The left block uses the variable size and has a single input, but the right block uses x and y and uses two inputs. These variables are local to each script, not global, so we don't have to worry about using different names. Both blocks can use x and y, and this would make the blocks more versatile. Additionally, if you add labels to your variables in the main block, it will make it easier for a user to determine what the inputs are actually changing. So, if you want a more generalized block that repositions the turtle on both the x and y axis, it might look something like this:
Then, you can combine it with the Square and Grid blocks like this to produce the same pattern, but it's easier to read what's happening line by line.
In this program, I've removed pen down from the Setup block; I always like to be able to see where in the program the pen is going up and down, especially when I'm planning for embroidery.
The turtle draws a square (returning to where it started), lifts the pen, and moves up half the height of the square.
It then places the pen down, draws the first grid, and lifts the pen back up.
Next, it repositions for the final grid, places the pen down, and draws the second grid (which uses the same generalized command as the first grid).
Finally, it lifts the pen. Since the pen started up, we want to maintain state transparency be also ending with the pen up.
You could abstract this out further creating specific Go to Position # blocks for the shift and turn directions, but I'd be sure to keep the parameters editable. This would allow you to abstract everything into a Create Pattern size Size command that bases the inputs for the Square, Shift, and Grid blocks off of the size parameter in the overall procedure.
To make this ready to stitch, all you need to do is replace the pen up and pen down blocks with the stitch and stop stitch blocks. If you leave the pen blocks in, the image that appears on the screen will show both the draw and the stitch lines. Please let me know if you have any questions or want further clarification on anything.
I like the way you've adapted the grid block here to make a large square with 4 smaller squares in the corner. It's worth noting that you can put the stitch block above the repeat loop. Once the stitch block has been activated, it does not need to be reactivated on each iteration. That said, keeping it in the loop does not do any harm here, but it's not particularly efficient and may lead to problems in more complex programs.
The bigger issue, which we talked about in class, is the positioning of the grids. Currently, you're doing everything with in-line code, which works, but it's not very elegant. If we were spending more time on this project, I'd recommend trying to write an algorithm that would automate the positioning, but we can also do this using lists. We'll get more into lists later in the semester, but you could iterate five grids, basing the starting point of each grid off of coordinates in a list.
For example, if you check the x-position and y position blocks in the Motion palette, the x and y coordinates of the turtle will appear on the stage. Record the starting point of each grid, and place the coordinates into a list of lists:
Activating this block will report an array that can then be used in an iterative loop.
Now, for each item in the list, the turtle will go to the x and y coordinates contained in that row of the array, point up, place the pen down, draw a grid, and place the pen up again.
When you prep your design for stitching, replace each pen command with the corresponding stitch command. You'll also want a stop stitching block after your first repeat loop, otherwise the embroidery machine won't not the thread before moving to the next part of the design.
Great design. Please let me know if you have any questions or want further clarification on anything.
Really cool project here. One problem a lot of people are running into is assuming that the machine will stitch exactly what the turtle draws. The pen commands and the stitch work similarly, but if you have both of them active in the same code, the frequently mask what the other is actually doing. For example, here is your design with the pen commands turned on:
And here is your design with the pen commands turned off:
The former is obviously what appears on the screen, but the latter is what will be stitched by the embroidery machine.
The example I provided uses all cross stitches. If you want something that looks more like the top image, you might try using a satin stitch block, which would produce the image below.
If you wanted to make it look even more like the first image, you would have to experiment with stitch widths and maybe rescaling some features. In the areas where the borders of the inner shapes overlap with the border of the square, the stitching may be so dense that it causes the thread to knot. The only way to know for sure is to try it, but scaling the inner shapes down so that they don't overlap as much with the square would also help.
Regarding the positioning of the inner shapes, you appear to be repositioning the sprite more than necessary. Instead of thinking of it as four separate arcs, think of it as two prolate spheroids like footballs. When you get the the end of the first arc, just make a 90 degree turn and repeat the arc.
You can abstract this into a shape command, and then you only need to reposition once (make sure you stop stitching while you reposition.
Hope this helps. Let me know if you need any other input.
Thanks for the double submission, and I apologize for the confusion. Both patterns are actually stitchable, but the second would need to be simplified greatly.
The only thing I'd really add here is abstracting out some of the commands (mainly what you have in the repeat block) into a custom procedure.
You also might try playing around with different stitch commands. You already have a zig-zag line, so you might want to stick with a running stitch, which follows exactly what you have drawn. However, I found that both the zigzag stitch and the z-stitch create interesting patterns with this design as well. The big thing is to remember to add a stop stitching block to the end, otherwise the machine won't sufficiently knot the thread when it finishes.
Let me know if there's anything else you have questions about.
Awesome design. Please see my response to Rachel on this thread; you two have a similar issue with both the pen blocks and the stitching blocks active at the same time. If you turn off the pen blocks, this is what the stitching blocks leave. It still looks cool, but it doesn't look the same. My response to Rachel has some tips on how to make the stitching look more like the drawing.
I also noticed you seemed to be having trouble creating the semi-circles procedurally. There was a lot of going directly to points, which works, but there is a cleaner way to accomplish the same effect.
In the code below, I'm using local variables in a custom procedure for two reasons: 1) it allows the design to scale more easily and 2) the named variables make it easier to follow what's happening.
I should start by noting that I've taken all of the pen commands out of these blocks. This is simply creating a path for the turtle to follow, and you would need either pen or stitch blocks on either side of it in your code. That being said, the first three blocks are otherwise unchanged.
What is different is the repeat and its contents. Since the turtle ends on a corner, we can simply repeat the same commands 4 times if we can find a way to make the turtle draw the semi-circle on one side. We can do that by having the turtle move over two grid squares, making the arc, and then moving over -2 grid squares (because the turtle is facing the opposite direction at the end of the arc, the grid squares are negative). Then a simple turn command places the turtle back in position to start the arc on the next side.
You may notice that this replicates stitches on either side of the arc. If you don't want that, you would have to specifically tell the program to stop stitching every time the turtle moves over.
Hope this helps. Let me know if you have any questions or want further input.
Love this design! It's simple, but also evocative. The way you designed it absolutely works, but you may be overcomplicating it slightly. I also may have understood something about your process, so if I have, just let me know.
In your first repeat, you are creating one large grid by connecting four smaller grids. As I said, this works, but you could also accomplish the same thing by dropping the repeat from the code and simply doubling the numbers in your Grid block. Also, I've viewed enough of these that I know what the parameters for the Grid procedure are, but from a documentation perspective you will likely find it helpful to provide labels, as shown below. This way, if you return to the project in a few weeks, you won't have to work as hard to remember what the inputs do.
I should also note that if you're creating a design you plan on using to stitch a pattern, you don't need to use the pen commands. Your stitch block will draw the paths for you, even if you don't have a pen color set. However, it it helps you differentiate different parts of the design from one another, setting pen color can be quite useful. It certainly makes the heart stand out.
Similarly, what you're doing for the heart works and produces a good result, but there's actually an arc block included as part of the Embroidery Library. Also, if you want to, we can make the design so that it scales the grid and the heart together. However, to do that, we need to know exactly where on the grid to place the heart.
Running the revised grid code (below) leaves the turtle facing left in the top right corner of the grid.
From there, moving it Over -240, turning left, and then moving Over -120 places it back in the bottom center of the grid:
Now we need to do a little math. This is going to take a little more setup, but once we finish, Snap*!* will do the heavy lifting for us any time we want to resize the design. If we know how wide each grid square is, we can determine the size of the heart. There are 20 lines and 19 grid squares. The grid is 240 steps wide, so each grid line is 240/19 or 12.63 steps away from its neighboring lines. The center point of square's base is in the middle of a grid square.
If we create a variable, we can use geometry and the pythagorean theorem to find the length of the straight portion of the heart. We can also use trigonometry to find the angle formed between the hypotenuse and the base of the triangle.
I'm using 9 grid squares for the length of the base and 12.5 grid squares for the height to roughly match your original design.
With these measurements, the rest of the heart should be easy. The turtle begins the heart pointing up in center. To get the first leg of the heart, we simply have it turn left 90 - Angle. Then, we have the turtle move Hypotenuse distance and point straight up again. This is essentially what you did, we're just automating the process.
Now, we want to draw the first curve for the heart. The arc command that is added as part of the Embroidery Library will let us make incredibly precise arcs with only two inputs, the radius of the arc, and the number of degrees around the circle we want the arc to go. So, we already know the width of this half of the heart (Base), and the radius of a circle with a diameter of Base is simply Base/2. We also want to make exactly one half of a circle, or 180 degrees. So the following block should give use 1/2 of a circle that perfectly matches the first curve of the heart.
I would like you to try to finish it from here. The goal is to generalize everything so that there is as little hard coding as possible. There a number of things that still need to be done.
- The blocks that set the global variables need to be incorporated into the setup block. This means that the setup block will need to allow for inputs (Size and Number of Lines that will be passed through to the code inside to calculate Base and Height.
- Subroutines need to be abstracted out in a logical way.
- The entire program needs to be go into a single command block that uses Base and Height to calculate and scale the entire pattern.
Here is the revised code so far, as well as a screenshot of what it creates. See if you clean it up the rest of the way, and don't hesitate to let me know if you have any questions.
This looks fantastic. I'm glad you were able to sort out the problem you encountered in class yesterday. The only suggestions I would add are these:
- The finished product (both the art and the code) look good, but the work space is a bit cluttered. When you're finished, it can help viewers follow your work if you remove unnecessary blocks from the environment. If you're still working with some of the blocks, just drag them off to the side and maybe flag them with a comment. You can do this by right clicking on a block and selecting add comment.
- If you look under the menu button in Snap, there's an option called Project Notes, we'll talk more about this next week, but it's a helpful spot for you to add describe your project and add context for readers who may be finding the code for the first time. It's also a good place to keep a change log if you're coding more complicated projects. For the sake of completeness, you might expand a little more in Project Notes on what you already wrote in the Snap Forum.
Great work!
First off, I want to say we loved the effect you created with the original design. Watching the Adrinka raster in was a lot of fun. I'm sorry we can't actually stitch it that way.
It looks like you have a great approach going now though. The satin stitch block works really well for creating wide lines. I'm sure you've noticed that you don't get the crisp, clean corners the way you were getting before, but if you offset the endpoints of each line by half the width of the line, that should bring them back. That would also mean repositioning the turtle more, so you may just want to wait and see how this pattern embroiders before putting in the extra work. If you like this does, great! If not, you can always adjust it.
I would try to condense the code a bit. You're probably already working on this, but there are two portions that look like they repeat.
and
The first draws what I'm calling the feet of the pattern, and the second draws the body sections. You could probably abstract these into sub-procedures to tighten up the code, but overall I think this project is great.
Please let us know if you have any questions or want more help.
Wow @maketolearn. Great explanations.
Great pattern! I can really see the inspiration coming through, and the result looks ready to stitch.
There are a couple way in which you could clean up the code a bit, just to make it more easily human-readable.
I'd start by taking all of your housekeeping code (clear, go to, etc...) and placing it in an Initialization custom block.
From there, it looks like you have the same pattern repeating four times, so it should be easy to build that into a custom procedure.
You could even go so far as to break the pattern down into sub-procedures, with the following sections being Leg One
and Leg Two
This would conform to our request that you not have more that about seven blocks of in-line code.
Finally, I'd end the entire program with a stop stitching block for two reasons. One, you always want to maintain state transparency and end a section of code in the same state that you started. Two, the stop stitching block tells the embroidery machine to knot the thread, ensuring that the pattern won't come unravelled once the thread is cut.
Good luck finishing this up, and don't hesitate to ask if you want additional input.
Hello! I've refined my project and updated this design and code as per the super helpful suggestions! Here is the link: Adrinka (Revised)
I have modified my design in terms of code to make it practical for stitching. My design was inspired by #3 of the Abusua Dua. I used cross grids as the main body, symbolizing the close knit relationship between the Adinkra people; and I applied satin stitch for the borders and arcs to emphasize the strength of their mutual support and community.
Here is the updated version link:
https://snap.berkeley.edu/snap/snap.html#present:Username=rachael_yuan&ProjectName=Embroidery%20Pattern%20Design%20Project_Updated_Rachael%20Yuan
Love this design. The overall effect is amazing, but like many people, you may find that the pattern that appears when you stitch does not match the pattern that the pen draws.
There are also a number of places where we could clean up the code a bit, so I'm going to try to illustrate how you could make the same initial pattern using the Embroidery Library. You'll still need to position everything, but hopefully this will help.
I'm going to start by using your Initialize block, followed by a Turn Left 45 degrees block. This sets the turtle in the proper orientation. The satin stitch block with a width 20 will produce a wide line, so I'm going to use that to move 100 steps, turn right 90, and then move 100 steps again.
That produces the following:
You'll notice that we don't get a crisp corner on the turn, but we can fix that by moving the turtle back half the width of the stitch before creating the second line.
Notice that we're stopping the stitch before we move back. This is to prevent stitching over the same area too many times and potentially tangling the thread. If you wanted to, you could repeat the loop four times and make a square, but I'm trying to stick with your method of pattern creation. We can then abstract that code into the following procedure.
Which draws this:
Lets abstract the procedure into the following block.
To put the dot in the shape, I'm going to backtrack to the elbow of the shape using the Over command and then turn left 45 degrees so that the turtle is pointing towards the shape.
To get the turtle into position for the dot, we need geometry. To make it simpler, I'm going to start building a Basic Pattern block as follows.
The distance from the outer corner of the turn to the inner corner (red arrow below) is the length of the hypotenuse formed by the triangle with a base and height of the stitch width (purple arrow below ). We will find this value with the Pythagorean Theorem.
If we create a script variable, we can set it to be equal to the length of the diagonal width of the stitch. You can rename the script variable by clicking on it in the script variable block.
However, this is starting to look a big messy, so I'm going to pause and create a custom reporter block. When you make a new block, if you select the middle option Reporter, you'll get a block that can be used as an input. I'm going to call my Pythagorean Theorem and give it the inputs a and b.
Now, I can use my custom reporter to set the script variable for the Diagonal Stitch Width.
Running this code will draw the two sides of the diamond and then reposition the turtle so that it's pointing right and positioned in the center of the elbow. We now need to move it forward to the starting corner of the dot. We can find the center point of the diamond the same way we found the center point of the corner, so lets create another variable and set it to be the length of the hypotenuse that would be formed by going from one corner of the square to the other.
This puts the turtle in the center of the diamond, but then you'll need to move it backwards again by the width of the stitch, as you'll see in a moment.
I had to play around with the half dot for a bit, but this is the algorithm I found worked best. It involves making a script variable called Dot Size, initializing it at 1, and then increasing it as the turtle moves forward for half the width of the stitch.
If you put it all together, you get the following. It still needs some abstraction, but you should be able to clean it up and use it to create your pattern in a manner similar to what you're already doing with the Pen commands.
This works really nicely. I'm going to give you a few tips just to make the code a little more efficient.
If we look in the setup block, you have a clear block at both the beginning and the end of the procedure. You really only need one, and having one at the end usually works best. Since we're stitching, we don't need the Pen commands anymore, so we can also remove pen up and pen down, unless you want to leave them. Leaving them will make sure that the pattern draws regardless of whether or not an Embroidery block is included.
If we take out everything that isn't absolutely necessary, we are left with this:
Clean and simple.
Next, the grid block looks good, but it relies on the stitch block to create the zigzag lines, so lets move that block up above the grid block. We also want to make sure to use a stop stitching block at the end. This ties the thread in a knot and keeps it from unravelling.
The final code will look something like this:
If you want to, you can further abstract or parameterize it. It looks like you have some additional code you were working on. If you'd like further feedback, just let me know!
This is a really cool pattern! The only thing it's really missing is abstraction. That's a lot of in line code, and you could definitely break it down into custom procedures.
To stitch it, you'll want to replace all of your pen down blocks with stitch blocks. I would recommend using the running stitch, since your pattern has very clean lines and the running stitch follows lines exactly. You'll also want to replace the pen up blocks with the stop stitching block. This will make sure the thread gets tied in a knot each time the needle moves, which will prevent the pattern from unravelling.
Finally, in your last two repeat blocks, the ones that draw the circles, it looks like you're repeating more than you need too. Eighteen repeats should complete the pattern, and there's no need to keep stitching once you get to that point.
Please let me know if you have any questions or want any further assistance!