How to Weave a Bedouin Sadu Fabric Pattern Using Adobe Illustrator | How To
In the Middle East, Al Sadu weaving is a traditional embroidery form of weaving that is hand woven by Bedouin women. Sadu is commonly seen on fabric used in tents or majlis floor pillows, carpets, and mats.
It is a beautiful symmetrical art form, made using traditional die-colored yarn with basic colors of black, white, beige, and red. The traditional pattern is based on particular narrow bands of geometric designs, and includes shapes like triangles, zigzag, diamonds, and dotted markings. These fabric woven designs have visual messages of the desert and nomadic lifestyle. They may include images of “horse’s teeth” which are stripes like a comb, or earrings (diamond shapes), tents (triangles), water (ripple diamond shapes), and sometimes camel forms.
In today’s tutorial, we are going to revive this traditional design by recreating this ethnic technique using simple tools and techniques found in Adobe Illustrator.
For inspiration, research the various Al Sadu patterns online, and if you want something quick, visit GraphicRiver to purchase any of the huge selection of patterns they have available.
Let’s start weaving!
1. How to Set Up a New Document
First, set up a New Document (File > New or Control/Command-N) with the following settings:
- Number of Artboards: 1
- Width: 1200
- Height: 1200
- Units: pixels
From the Advanced tab:
- Color Mode: CMYK
- Raster Effects: High (300 ppi)
- Preview Mode: Default
2. How to Create the Al Sadu Weave Pattern Form
Let’s start simple by creating a rectangle with null Fill and black Stroke.
Take the Rectangle Tool (M), click once on the artboard to open the Rectangle dialog box, enter the dimensions 32 x 52 px, and click OK.
We need to transform the rectangle into a diamond-like shape.
With the shape selected, Object > Path > Add Anchor Points, to add evenly spaced anchors along the rectangle path.
Then from the Tools panel, select Delete Anchor Point tool (–) to remove the corner anchors to create our diamond-like shape.
Next, we need to round the corners of the diamond-like shape to create a yarn-like shape.
Take the Direct Selection Tool (A) and select all the top and bottom anchor points. This will enable the Live Corners widget to appear next to each corner point.
Select the Corners link from Control Panel. From Control Panel, you can then set the Corner style to Round, Radius to 2 px, and the type of Rounding to Absolute.
Now we need to curve the side edges.
Use the Direct Selection Tool (A), and select the left and right anchor points.
Then, from the Corners link in Control Panel, set the Corner style to Round, Radius to 21 px, and the type of Rounding to Absolute.
Our new shape will act as the main weave thread form.
Take the Selection Tool (V), and from the Tools panel select Swap Fill & Stroke (Shift-X).
Turn on the Smart Guides (Command-U or View > Smart Guides), and position the weave-thread shape on the edge of the artboard as shown.
With the weave-thread shape selected, Copy (Command-C) and Paste in Front (Command-F), to create the same shape on top of the original.
Object > Transform > Move (Shift-Command-M) to open the Move dialog box, and position as follows:
- Horizontal: 14.625 px
- Vertical: 28.125 px
- Distance: 31.7003 px
- Angle: -62.53°
- Check Preview
Using the Direct Selection Tool (A), select both weave-thread shapes, hold down the Shift–Alt keys to constrain movement and duplicate the selection, and then drag horizontally till the edges of the shapes meet.
Transform Again by using the Command-D shortcut to repeat the move, and continue to click Command-D until the shapes reach the edge of the artboard, as shown.
Select All (Command-A), to select all the horizontal rows.
Hold down the Shift–Alt keys to constrain movement and duplicate the selection, and drag vertically till the edges touch at the side as shown.
Use the Command-D shortcut to Transform Again and duplicate. Repeat till you reach the base of the artboard.
3. How to Color the Weave Pattern
Now that our weave is formed, let’s color our structure. You can generate interesting color palettes from photos, using sites such as Coolors.co, Colormind.io, or Canva.com.
Open the Swatches panel (Windows > Swatches).
Elsewhere on the artboard, draw a series of square shapes to form the colour palette of your design. The traditional colours of Al Sadu fabric are black, white, brown, beige plus red and sometimes may include blue, green or orange.
I used these hex colors:
- Burnt Red
- Burnt Orange
- Pumpkin Orange
- Eggplant Purple
- Purple Grey
- Rose Red
- Dark Aubergine
- Dark Red
- Dark Grey Aubergine
- Yellow Grey
- Light Grey
Once you’ve made your color selection for the design, use the Selection Tool (V) and select all the square shapes that form your palette. Click the New Color Group icon in the Swatches panel to create the color swatches.
Name the color group Sadu, select Selected Artwork and Include Swatches for Tints, and click OK.
Afterwards, you can Delete all the color squares and keep five so we can create our gradients.
Next, let’s create our gradients, so our fabric can have a realistic appearance.
Open the Gradient panel (Window > Gradient). Use the Gradient panel to create the following gradients:
- Red gradient: Burnt Red
#70150e+ Rose Red
#e51145+ Burnt Brown
- Dark Red gradient: Dark Red
#a91927+ Dark Red
- Blackish gradient: Blackish
#010101+ Dark Grey Aubergine
- Whitish gradient: Yellow Grey
#aa9ea6+ Light Grey
- Orangish gradient: Burnt Orange
#d54d15+ Pumpkin Orange
#db6811+ later added a Yolk Yellow of
Drag the gradient fills from the Fill box in the Tools panel to the Swatches panel in order to add the gradient.
Delete the squares afterwards—we no longer need them.
Note: I set the Gradient Angle to 90°, to preview the gradient blend properly.
Now let’s color in our weave.
Take the Selection Tool (V) and select the first three columns. Apply a Linear type, Dark Red gradient from the Gradient panel and set Angle: 90°.
With the Selection Tool (V), select the next seven columns.
Apply a Linear type, Blackish gradient from the Gradient panel and set Angle: 90°.
Then select the following three columns and apply a Linear type, Dark Red gradient set to Angle: 90°.
Continue with the same color approach with each Gradient Angle set at 90°.
- 5 columns Blackish gradient
- 3 columns Red gradient
- 2 columns Orangish gradient
- 1 column Whitish gradient
- 9 columns Blackish gradient
- 1 column Whitish gradient
- 3 columns Orangish gradient
- 10 columns Red gradient
- 2 columns Whitish gradient
- 11 columns Blackish gradient
- 2 columns Whitish gradient
- 3 columns Dark Red gradient
- 7 columns Blackish gradient
Let’s apply a background for the weave, by creating our background shape.
Select the Rectangle Tool (M), and click once on the artboard to open the Rectangle dialog box.
Set Width and Height to 1200 x 1200px, and click OK.
Open the Align panel (Window > Align) and select:
- Align to: Align to Artboard
- Align Objects: Horizontal Align Center & Vertical Align Center
Move on to the Gradient panel, and apply the following gradient to the square:
#320d16 + Brick Red
#6c1227 + Black
#010101 + Rose Red
#7b132c + Dark Red
With the shape selected, Object > Arrange > Send to Back (Shift-Command-[).
4. How to Design & Create the Pattern
Let’s add some design onto our weave.
Use the Selection Tool (V) and select the thread shapes you want to form a design pattern with. To help you out, refer to Sadu fabric references available online.
The process is easy. Just select the thread shapes you want to apply similar gradients to, and then use the Eyedropper Tool (I) from the Tools panel, and click on a gradient selection used on an adjacent form.
Once you have figured out the design, select the artwork: Select All (Command-A).
Go to Object > Pattern > Make. This will pop up the Pattern Options window, where
you will need to adjust the settings:
- Name: Sadu Pattern
- Tile Type: Grid
- Width: 1200 px
- Height: 1185 px
- Set the Overlap to Left in Front and Bottom in Front.
Hit Done to save all our
In the Swatches panel, you will notice that the Sadu Pattern has been quickly added.
So now if you select the Rectangle Tool (M) and draw a random shape with the Sadu Pattern Fill, you will see a seamless pattern created.
After that, you can safely delete your pattern elements because the pattern is already stored in the memory of the file.
Awesome Weave Work!
I really hope you liked this tutorial and enjoyed creating this amazing seamless
you can see, it is not that hard to create amazing patterns in Adobe
If you have any
questions, please feel free to post them in the comments section below, and I will get back
to you as soon as I can.
Try out these other great Middle Eastern tutorials in the links below.