Sharon's Dear Jane Pages

Purpose of the Virtual Design Wall

When I started designing my Dear Jane web pages, I found it exciting to see the blocks for a row on the screen. I thought to myself how interesting it would be to see all the blocks and triangles on one screen length. I could get a visual of the color scheme by using my OWN blocks. I'm using the Bingo method of row construction - H3, M1, G4, etc. Even if you're doing your blocks in order row by row, you can use this Virtual Design Wall to see your progress.

An advantage is that my blocks stay dust-free and away from the sun. In my home I don't have room for a real design wall the size of this quilt.

The disadvantage is that the table below loads each scanned block individually. On the web, depending on your connection rate, that could be anywhere from 7 minutes to 56 minutes. At home, when viewing your Virtual Design Wall from your hard drive, that time is decreased dramatically. It is important to scan your blocks at an optimal filesize. The filesize of my blocks range from 10k to 15k. You can imagine how much time it would take if each of your blocks is 100k or more.

HOT TIP
An option would be to use your graphics software to do a screen snapshot of your Virtual Design Wall on your web browser. You can crop the image down to show just the quilt. Save the quilt image as a .gif or .jpg file and load that for people to see.

Can I use this page without having a web site?

Yes!

On your hard drive make a Dear Jane directory. The Virtual Design Wall HTML file and your scanned blocks .jpg files will be stored in this directory.

Create a dearjane directory

1. Click your

button.

2. Click on

3. Highlight your (C:) drive or another hard drive you want to use to store your DJ block pictures.

4. Click on File, New, Folder.

5. Your screen on the bottom right side will show

.

6. Type dearjane and press [ENTER].

7. Your screen will show

8. Congratulations!!! You now have a dearjane directory on your computer. Save all your block pictures and your virtual design wall HTML code in your dearjane directory.

View your virtual design wall on your computer from your hard drive

Open your web browser. In the place where you type the URL type: c:\dearjane\mydjvdw.htm and press [ENTER]. Your page will load from your hard drive.

INSTRUCTIONS:

Step 1 - Scan your blocks.

Remember to keep an optimal filesize. Scan each block. Save the block graphic as a filename of a4.jpg, b13.jpg, etc. When typing your filenames, ALWAYS USE lowercase. Some web page hosting sites do not allow uppercase in the filenames. It will save you a lot of aggravation when uploading your block graphic files to your web hosting site.

Step 2 - Save the web page HTML Source Code to your hard drive.

	You will need to view the HTML Source on this page and save the HTML Source Code to your own hard drive. Some browsers will allow you to do a File, Save As, HTML code. Save as mydjvdw.htm filename to your Dear Jane directory.
	Quick way to get the template. Click here: mydjvdw.zip This zip includes the blank.gif and the html coding.You will need to unzip annd save the 2 files to your Dear Jane directory. Please note I changed the 0.gif to blank.gif to allow for a white background in the table cells and the page. To see just the template page. Click here: www.geocities.com/sharbu.geo/dj/mydjvdw.htm

Step 3 - Adding blocks to the Virtual Design Wall.

When you complete a DJ block, scan the block and create a .jpg file. Edit the HTML code on c:\dearjane\mydjvdw.htm. I use Notepad that comes with Windows. Do not use wordprocessing software to edit HTML files. It will create hidden formatting characters. You need to save as DOS text file. Or use Front Page or another web page software to edit your pages. I use FrontPage Express that came with Windows 98.

The line of HTML code looks like this:

<td><font size="1"><IMAGE SRC="0.gif" ALT="E13 Moth in a Web" WIDTH="20" HEIGHT="20"></font></td>

Replace the 0.gif filename with your new block name. Your line of HTML code should look like this after the update:

<td><font size="1"><IMAGE SRC="e13.jpg" ALT="E13 Moth in a Web" WIDTH="20" HEIGHT="20"></font></td>

Save your edited HTML file.

You will need the "0.gif" file for the blank squares. Move your cursor over the right side box. Right click on your mouse & Save Picture As.

Get it Here:

How do I change the background table color to match my web site or background fabric color?

I use PaintShop Pro 5.01 to create and edit my graphics. The steps will be similar if you are using another graphics package.

Go to PSP and click File, New. The size should be 100 pixels x 100 pixels file. Resolution 72, Background - White. Click OK.

On the screen somewhere (mine is on the righthand portion of the screen) you'll see a rainbow of colors. Move your mouse button over those colors. You see a little box by the rainbow colors that changes each time you move your mouse.

Click your left mouse when you find a color you like. That will change your foreground color. The two color boxes that are almost on top of each other show the foreground/background colors you have chosen.

If you know the RGB color you want, you can double-click the foreground/background boxes. It will bring up a Color Selection Window. Go to the area where it shows Red-Green-Blue with input boxes alongside. Change those to the RGB color numbers. Click OK.

Click on the Flood Fill icon. It looks like a paint can turning over. Go to your new image and left-click. It will fill your new image with the foreground color.

Now the size of the 0.gif file should only be a 10 pixel square. To do that, double-click on the Selection box. It looks like a rectangle with dashed edges. It will bring up a Select Area Selection Window. The coordinates are: Left 0, Right 10, Top 0, and Bottom 10. Click OK.

On the top menu, select Image, Crop to Selection.

Click File, Save As, name as 0.gif. Save this to your Dear Jane directory on your hard drive.

Once you have these instructions down, you will want to edit out the instructions in the HTML source code of the c:\dearjane\mydjvdw.htm file using Windows Wordpad.

Permission is granted for use by Dear Janers to use on his/her personal computer, website, or for use in a Dear Jane teaching class. If using for a class, please give credit to me, Sharon Mastbrook, as the creator of the Virtual Design Wall.

Purpose of the Virtual Design Wall

Can I use this page without having a web site?

INSTRUCTIONS: Step 1 - Scan your blocks.

INSTRUCTIONS:

Step 1 - Scan your blocks.