Hi. We're Pixite. We make photo apps for iOS. This is a post from our blog.

How to Create a Kiddie Rocket Ride Illustration in Assembly

Cayce Garrison — September 8, 2017

I think we can all remember those times when we went to the grocery store or pharmacy with our parents and begged them to let us ride on the kiddie rides outside the store. In my case I usually got a “No.” Thats besides that point. Today I will show you how create a kiddie rocket ride illustration using the Pixite’s vector app Assembly. Let’s get started.

Building The Rocket Body

To begin we will need to grab a few shapes to help us create the body of the rocket. Select the shape you wish to use from the Shapes panel. The selected shape will appear on your artboard automatically. To rotate or resize the shape, use the circle that appears at the corner of the shape. I have enlarged the rectangle and rotated it 90 degrees to start assembling the basic shape of the rocket.

Next we will creating the end caps for the body. Assembly allows you to stretch shapes and to do so tap the circle in corner of the shape and tabs will appear. For this dome shape, I stretched it to the desired length using the tab on the right.

Once I positioned the shape where I wanted, I then copied the selected shape, mirrored it and placed the copy where I wanted it.

Now I want the shapes to become one large shape. To Combine them tap the screen and drag to multi select the desired shapes. The selected shapes will give you a couple different options; the Group button on the left and the Pathfinder on the right. Since I want one large shape I’ll select Pathfinder and then Combine.

I now have one solid shape to work from. Before continuing on, I made a copy of the body and placed it off the artboard for use at later time. Now I’ll tackle the detail of the rocket.

Adding Details

I want a light at the tip of the ship so I’ll assemble it with a couple different shapes: a dome and an ellipse.

The rim around the light should have a rounded bevel and to do this I selected a cone shape with a rounded bottom. To create the bevel I sized the cone larger than the ellipse and positioned it so that there is just a sliver of the ellipse showing. I then select both shapes and use the Pathfinder and select Intersect. 

I am left with a trimmed ellipse with a perfect bevel.

Next I’ll create the shape of the seat opening. I’ve placed several shapes into a configuration that I like. I then Multi-Select and Combine them. Once combined I’ll change the color of the new shape by selecting Styles and filling the shape with white. Having the shape white helps decide on where I want to cut out the seat from the rocket’s body.

Like the process to create the light trim, I select both the rocket body and the seat shape and use Cut Out.

Assembling the rear wing is quick. Just a few shapes and I have it together.

Make sure the wing is behind the rocket body.

I am getting tired of looking at a grey rocket so let I’ll begin to color. Again to change the color select the shape and then select Style from the bottom tabs. You have the choice to pick a color from the curated color palettes or create your own color with the color wheel. I am going for a retro look of my rocket ride so I’ll be working with more muted tones.

Remember that extra rocket body I saved for later? Now is when I will use it, so I’ll bring it back into my artboard and then Copy it again. I line the shapes up but move one slightly above the other leaving a little sliver of the bottom shape showing. It will help to color the top shape white or at least a different color so the sliver is easier to see. I am doing this to create a different colored bottom to the rocket.

Once I’ve decided on the shape I want, I select both shapes and select Cut Out. Now I am left with just the new rocket belly shape.

After I moved the new shape into place on the rocket I will begin to create the more intricate details of the rocket. I’ll start by adding the seams between the metal panels. Using the shapes from The Strokes category are perfect for this because these shapes only get longer or shorter without thickening the stroke itself.

Next I start to assemble the rocket’s main engine. Just a couple shapes and contrasting colors is all that is needed.

To help the wing pop I added a stroke around it. To do this I tap the wing shape and select Styles. From that menu I select Stroke. Within the Stroke menu I have the option to adjust the stroke thickness with the slider, change from a solid line to dashes, and change from a squared edge to a rounded edge. For the wing I have decided to go with a rounded edge stroke.

I want a second wing visible from the side so I create the with the help of two domes and a thin rectangle. Before I Combine them, I make sure they match the original wing in thickness and length.

I want to add a second smaller rocket booster to the side so I Copy the original engine, shrink it, and build the rest it with a few other shapes.

Now for some more detail. I add a few more seam lines as well as rivets to the rocket body and wing. I changed the colors of the seams and rivets to a more muted tone of the rocket body color.

Kids need something to hold on to when the ride gets going so a handle built with a couple stroke shapes and a circle are all that is needed.

Building The Ride’s Base

With the Rocket’s details added I’ll move onto the building the base of the ride. One big trapezoid is all that is needed to get started. I add a stroke around it and then add in an arch shape to connect the rocket to the base.

I add in another smaller trapezoid for some more detail and then begin to assemble the coin slot box.

I add a stroke to match the rest of the base and a bracket to attach the coin box to the base.

I ended up changing the orientation of the coin box from vertical to horizontal.

Now I need a place for the coins to be inserted so I created the drop in slot with just one shape. Next I want to use Assembly’s Type feature to write the price. To create the price I tap Type from the bottom menu and then New Type Object. I type 25 and then select Done.

Assembly’s Type feature offers 25 fonts and various versions of their font family. It also has the ability to change your letter spacing (kerning).

I create a cent symbol by Combining a lowercase “c” and a thin rectangle. The coin slot color was changed to match the base trim and the text was colored a darker yellow to give the look that the text was molded into the coin slot.

Naming the ride is necessary so I use the the Type tool to create that. A quick creative placement and a slight rotation and its good to go.


Now for the really fun part. Shading. This step is where the rocket ride really pops.

To create the shadows I select the shape in the area I want a shadow. I Copy that shape and then open the Styles menu. I tap Fill and drag the Opacity slider all the way down to Off. Next I select Shadow. In the Shadow menu I have the option to darken or lighten the shadow and make it smaller or larger.

I continue to add shadows to all the areas where shadows make sense.

A colored background is added to help bring the whole illustration together. Lastly I add shadows to the seams of the rocket to help create the look of it being worn and tired.

There you have it. A retro inspired kiddie rocket ride. I hope you enjoyed this detail tutorial on creating this illustration in Assembly. We would love to see what you create in Assembly so please share it with us.




Cayce Garrison
Pixite Content Manager

See More from Cayce Garrison