-
Notifications
You must be signed in to change notification settings - Fork 2
/
zpinstructions.html
333 lines (292 loc) · 16.4 KB
/
zpinstructions.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
<!DOCTYPE HTML>
<html lang="en">
<head>
<title>LearnMYOG Zip Pouch</title>
<link rel="apple-touch-icon" sizes="180x180" href="images/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="images/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="images/favicon-16x16.png">
<link rel="manifest" href="images/site.webmanifest">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" />
<meta name="description" content="Learn to Make Your Own Gear (MYOG). Sewing patterns and tutorials for outdoor adventurers."></head>
<link rel="stylesheet" href="assets/css/main.css" />
<noscript><link rel="stylesheet" href="assets/css/noscript.css" /></noscript>
<script defer src="https://code.jquery.com/jquery-3.6.3.min.js"></script>
<script defer src="assets/js/colorswitcher.js"></script>
<script defer src="assets/js/header.js" type="text/javascript"></script>
<script defer src="assets/js/nav.js" type="text/javascript"></script>
<script defer src="assets/js/footer.js" type="text/javascript"></script>
<!-- Global site tag (gtag.js) - Google Analytics GA4 -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-WP4C42S5VW"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-WP4C42S5VW');
</script>
<!-- Global site tag (gtag.js) - Google Analytics GA4 -->
</head>
<body class="is-preload">
<!-- Wrapper -->
<div id="wrapper" class="divided">
<!-- Banner -->
<header-template></header-template>
<!-- Nav -->
<div class="spotlight-color invert align-center">
<nav-template></nav-template>
</div>
<!-- Pattern Generator -->
<section class="wrapper style2 align-center">
<div id="main" class="inner">
<header>
<h2>Zip Pouch Pattern Generator</h2>
<p>Zippered boxy pouch for outdoor adventurers</p>
</header>
<div class="gallery style1 small">
<article>
<a href="images/zipsack/zipSackCompleted.jpg" class="image">
<img src="images/zipsack/zipSackCompleted.jpg" title="Boxy bag made with this generator" />
</a>
</article>
<article>
<a href="images/zipsack/zippouch2.jpg" class="image">
<img src="images/zipsack/zippouch2.jpg" title="Small snack bag made with this generator along with self made iron-on labels." />
</a>
</article>
</div>
<div class="index align-left">
<section>
<header>
<h3>Pattern Generator</h3>
</header>
<div class="content">
<p><span class="image left"><img src="images/zipsack/box.jpg" alt="zip pouch plan" /></span>Create custom-sized stuff sacks effortlessly without complex calculations or 3D modeling. Simply input your desired finished 3D stuff sack dimensions, and our generator will calculate precise 2D pattern panels. Say goodbye to fabric waste and guesswork, especially if it's your first MYOG (Make Your Own Gear) project!</p>
<form method="post" action="#">
<div class="fields">
<!-- Set Units -->
<div class="field third">
<label>Measurement Units</label>
</div>
<div class="field third">
<input type="radio" name="units" class="dimension" id="imperial" value="0" checked>
<label for="imperial">Inches (in)</label>
</div>
<div class="field third">
<input type="radio" name="units" class="dimension" id="metric" value="1">
<label for="metric">Centimeters (cm)</label>
</div>
<!-- Set Dimensions -->
<div class="field third">
<label for="length">Length</label>
<input type="number" name="length" class="dimension" id="length" value="" />
</div>
<div class="field third">
<label for="width">Width</label>
<input type="number" name="width" class="dimension" id="width" value="" />
</div>
<div class="field third">
<label for="height">Height</label>
<input type="number" name="height" class="dimension" id="height" value="" />
</div>
</div>
<!-- Button used for tab and force change -->
<div class="actions small">
<button class="button small" type="button">Generate</button>
</div>
</form>
<span class="image right"><img src="images/zipsack/box0.jpg" alt="zip pouch pattern" /></span>
<p>Our provided panel dimensions already include the seam allowances. Additionally, note that the Zipper Allowance is 1/2 in. (13 mm)</p>
<ul class="alt">
<li><strong>Fabric Length: <span class="patternWidth"></span></strong></li>
<li><strong>Fabric Height: <span class="patternHeight"></span></strong></li>
</ul>
</div>
</section>
</div>
</div>
</section>
<!-- Zip pouch materials -->
<section id="zipPouchMaterials" class="wrapper style1 align-center">
<div class="inner">
<header>
<h2>Assembly Instructions</h2>
<p>Sewing Made Simple: Your Beginner's Guide to Gear Making!</p>
</header>
<div class="index align-left">
<section>
<header>
<h3>Materials</h3>
</header>
<div class="content">
<p>For guidance on suitable technical fabrics, recommendations, and trusted vendors, refer to our <a href="fabrics.html">Fabrics Guide</a>. Please note that this is a beginner-friendly project, and it is intended for non-fray technical fabrics. Therefore, seam binding or seam finishing techniques are not included in the instructions.
</p>
<div class="table-wrapper">
<table>
<thead>
<tr>
<th>Materials</th>
<th>Links</th>
</tr>
</thead>
<tr>
<td>Medium-weight Pack Fabric such as<br>HyperD 300, Cordura 500, or ECOPAK EPX200</td>
<td><a href="https://ripstopbytheroll.com/collections/pack-fabric?rfsn=4608557.2d546b9" target="_blank"><img class="partner icon" src="/images/shared/partners/48/rbtr.png" alt="Ripstop by the Roll logo"></a></td>
</tr>
<tr>
<td>Coil Zipper, YKK #3 or #5</td>
<td><a href="https://ripstopbytheroll.com/collections/coil-zipper/products/ykk-coil-zipper?rfsn=4608557.2d546b9" target="_blank"><img class="partner icon" src="/images/shared/partners/48/rbtr.png" alt="Ripstop by the Roll logo"></a></td>
</tr>
<tr>
<td>Coil Zipper Slider</td>
<td><a href="https://ripstopbytheroll.com/products/ykk-coil-slider?rfsn=4608557.2d546b9" target="_blank"><img class="partner icon" src="/images/shared/partners/48/rbtr.png" alt="Ripstop by the Roll logo"></a></td>
</tr>
<tr>
<td>Grosgrain Ribbon<br>1/2"-3/4" (13-20mm) wide, 4" (10cm) long</td>
<td><a href="https://ripstopbytheroll.com/collections/grosgrain-ribbon/products/mil-spec-nylon-grosgrain-ribbon?rfsn=4608557.2d546b9" target="_blank"><img class="partner icon" src="/images/shared/partners/48/rbtr.png" alt="Ripstop by the Roll logo"></a></td>
</tr>
<tr>
<td>Polyester Thread such as<br>Gutermann Sew-All or Gutermann MARA 70</td>
<td><a href="https://ripstopbytheroll.com/collections/thread-tools-repair/products/gutermann-mara-70?rfsn=4608557.2d546b9" target="_blank"><img class="partner icon" src="/images/shared/partners/48/rbtr.png" alt="Ripstop by the Roll logo"></a></td>
</tr>
<tr>
<td>Machine Needles such as<br>Schmetz Universal size 90/14</td>
<td><a href="https://ripstopbytheroll.com/collections/thread-tools-repair/products/schmetz-universal-machine-needle?rfsn=4608557.2d546b9" target="_blank"><img class="partner icon" src="/images/shared/partners/48/rbtr.png" alt="Ripstop by the Roll logo"></a></td>
</tr>
</table>
</div>
<p class="disclosure">Qualified purchases support LearnMYOG.com at no additional cost to you. See <a href="/about.html#disclosures">Disclosures</a> for more information.</p>
</div>
</section>
<section class="spotlight style1 content-align-center">
<div class="content">
<h3>Ultimate Beginner Guide</h3>
<p>From Day 1 to Gear Making Guru <br>
Detailed MYOG Guide and Essential Tools</p>
<a href="/zerotohero.html" class="button primary"><span class="icon solid fa-forward"></span> Zero to Hero Guide</a>
</div>
<div class="image">
<img src="images/index/zero2hero.jpg" alt="sewist" />
</div>
</section>
<section>
<header>
<h3>Measure and Cut</h3>
</header>
<div class="content">
<span class="image right"><img src="images/zipsack/box1.jpg" alt="Pattern pieces"/></span>
<p><strong><span class="sA">Based on units selected</span></strong> seam allowances are already included in the pattern. Not seeing measurements? Generate pattern dimensions above.</p>
<ol>
<li>Cut one Fabric Panel from your fabric.<br> <strong>Length: <span class="patternWidth">input</span></strong> and <strong>Height: <span class="patternHeight">input</span></strong></li>
<li>Cut one Zipper. <strong>Height: <span class="patternHeight">input</span></strong>
For more information on zippers, see our <a href="articles/zippers.html">Zippers Guide.</a></li>
<li>Cut two pull loops from grosgrain ribbon, each <strong>3 in. (7.5cm)</strong> long.</li>
</ol>
<p>To enhance clarity, we use light grey to represent the wrong side of the fabric and white to depict the right side in the illustrations. The <span style="color:red">red</span> dashed line illustrates the seam being sewn.</p>
</div>
</section>
<section>
<header>
<h3>Attach the Zipper</h3>
</header>
<div class="content">
<span class="image right"><img src="images/zipsack/box2.jpg" alt="Sew first edge to zipper"/></span>
<p>Traditional zippers have teeth on the right side, while water-resistant zippers feature teeth on the opposite side. Learn more with our <a href="articles/zippers.html">Zipper Guide</a>.</p>
<ol>
<li>Align the zipper right sides together with the edge of the Fabric Panel. Using a zipper foot, sew with a <strong>3/8" to 1/2" (10-13mm)</strong> seam allowance.</li>
<li>To sew the opposite edge, first fold the other Fabric Panel over so its edge aligns with the zipper tape. With the zipper foot still installed, sew along the edge of the zipper tape, ensuring the fabric is right sides together. Use the same seam allowance of 3/8" to 1/2" (10-13mm).</li>
<li>After sewing the zipper to both fabric panels, topstitch along the seam allowance on the right side of the fabric. This adds a decorative finish and helps to keep the fabric flat. Use a regular presser foot and sew close to the edge of the fabric, about <strong>1/8 inch (3mm)</strong> away from the seam.<br>
📌 Before topstitching, open or separate the zipper to make the process easier and ensure smooth stitching along the fabric edge.
</li>
<li>Carefully install the zipper slider, ensuring it engages properly with the teeth. Move the slider up and down the zipper to test its functionality.</li>
<li>Sew small grab loops to the ends of the zipper by folding each end of the grosgrain ribbon over the zipper tape and stitching securely with a <strong>1/4 in. (6mm)</strong> seam allowance. These loops provide a convenient grip for opening and closing the zipper. Be careful not to break your needle as you sew over the zipper. And only sew through the top layer of the Fabric Panel.</li>
</ol>
<img src="images/zipsack/box3.jpg" class="image small" alt="Sew second edge to zipper"/>
<img src="images/zipsack/box4.jpg" class="image small" alt="Sew second edge to zipper"/>
<img src="images/zipsack/box4a.jpg" class="image small" alt="Sew second edge to zipper"/>
</div>
</section>
<section>
<header>
<h3>Top and Bottom Seams</h3>
</header>
<div class="content">
<span class="image right"><img src="images/zipsack/box5.jpg" alt="Sew the ends of pouch closed"/></span>
<ol>
<li>Turn the pouch right sides together and center align the zipper.</li>
<li>⭐️ Double check your zipper pull is installed! ⭐️</li>
<li>Sew the ends closed with the <strong><span class="sA">3/8 in.</span></strong> seam allowance. </li>
<li>Level up your Zip Pouch by finishing your raw edges. Simply fold and align grosgrain ribbon along the raw fabric edge, encasing it, and stitch close to the edge to secure it in place. Trim and melt any excess ribbon for a neat finish.This provides a clean and durable finish while preventing fraying.</li>
</ol>
</div>
</section>
<section>
<header>
<h3>Boxing the Ends</h3>
</header>
<div class="content">
<ol>
<li>Pull perpendicular to the end seams, press the sides inwards to form crisp boxed corners along the bottom seam.</li>
<li>Finger press the end seam flat and square and then draw two marks from the left side:
<ul style="margin:0;">
<li>1/2 Height: <strong><span class="halfBottomHeight">input measurements</span></strong></li>
<li>Bottom Width: <strong><span class="width">input measurements</span></strong></li>
</ul>
</li>
<li>At first mark, draw a <strong><span class="height">height</span></strong> line perpendicular and square to bottom seam.</li>
<li>Repeat again at the next mark.</li>
<li>Stitch along the vertical lines forming the rectangular bottom.</li>
<li>Before trimming off the corners, turn your bag right side out to check for overall symmetry.</li>
<li>Trim the corners off about <strong><span class="sA">3/8 in.</span></strong> from the seam.</li>
<li>To bind the raw fabric edges with grosgrain ribbon, simply fold and align the ribbon along the raw edge, encasing it, and stitch close to the edge to secure it in place. Trim and melt any excess ribbon for a neat finish.</li>
</ol>
<img src="images/zipsack/box6.jpg" class="image fit" alt="Pattern"/>
</div>
</section>
<section>
<header>
<h3>Finishing Up</h3>
</header>
<div class="content">
<span class="image right"><img src="images/zipsack/zippouch2.jpg" alt="sample stuff sack"/></span>
<ol>
<li>Turn your Zip Pouch right side out one final time!</li>
<li>Your high quality custom sized Zip Pouch is now ready for use! Transform your fabric scraps into versatile and practical gifts or enhance your gear organization with these fantastic bags.</li>
</ol>
<h4>👏 Congrats on making your own custom Zip Pouch!</h4>
<p>If you're ready to tackle a more challenging project, check out the <a href="uzip.html">U-Zip Bag</a> next!</p>
</div>
</section>
</div>
</div>
</section>
</div>
<!-- Footer -->
<footer-template></footer-template>
<!-- HTML Template Scripts -->
<script defer src="assets/js/jquery.scrollex.min.js"></script>
<script defer src="assets/js/jquery.scrolly.min.js"></script>
<script defer src="assets/js/jquery.poptrox.min.js"></script>
<script defer src="assets/js/browser.min.js"></script>
<script defer src="assets/js/breakpoints.min.js"></script>
<script defer src="assets/js/util.js"></script>
<script defer src="assets/js/main.js"></script>
<script defer>
window.addEventListener('load', function () {
const pgtitle = document.location.href.match(/[^\/]+$/)[0] //get page name e.g. map.html
try {
document.querySelector(`#nav .links a[href*="${pgtitle}"`).parentElement.classList.add("active");
console.log(pgtitle,"is a nav element. Set active.")
} catch (TypeError) {
console.log(pgtitle,"not a nav element.")
}
}, false);
</script>
<!-- MYOG Pattern Scripts -->
<script defer src="assets/js/zipsack.js"></script>
</body>
<!--
Story by HTML5 UP
html5up.net | @ajlkn
Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
-->
</html>