Category Archives: Design

SketchUp Three (Part Two) – Adding Details

Framework

Framework

If you’ve been following this series (Part OnePart TwoPart Three), you should now have a framework of a house. Now we shall add some extra features, and introduce some new techniques.

So, open up your House file, and also the blueprint you are working from, and we’ll jump in!

Doorways

To get into the house, we are going to need some doorways. My research tells me that an average door is 36″ by 80″ (about 1m wide, 2m tall). On my blueprint, the front door is about two feet from the left corner, so lets start marking out these measurements:

Guide Lines

Guide Lines

Snap Effect in Action!

Snap Effect in Action!

Now draw a Rectangle for the doorway, and use the Push/Pull to create the doorway! The Snap-Effect will keep you lined up properly:

Now that we know how to make a doorway (Draw Guidelines using Measuring Tool, then Push/Pull to create gap), we should make all of our doorways.

By now, we will have covered our Scene in guidelines, and rather than helping, they will be getting in the way! We could go round and delete them one-by-one, but there is an easier way! The “Delete Guides” entry on the Edit Menu!

Delete The Guidelines

Delete The Guidelines

Window

Window

OK, that’s the doors … we need to do the same for the windows! For the purposes of this tutorial (and simplicity!), I will be having all of the windows start three feet from the floor, and the tops be level with the top of the doors (80″, remember? This is 6′ 8″, or about 2 meters in new money). Again, put some guides in place. I’m making the front window 6′ wide, placed approximately halfway between the door and the right corner. Then draw the rectangle, and Push/Pull it. Again, continue around the house, putting all of the windows in place.

Doors and Windows

Doors and Windows

Actual Doors and Windows

Now, we want to put the actual doors and windows in place! Now, we can design our own furniture, and we already have most of the tools to do so (Draw a rectangle 6′ 8″ x 3’6″, Push/Pull to 1″ thick, BAM! Door!). Or we can rely on the kindness of strangers!

The SketchUp Warehouse is a repository where anyone can upload their creations, for other people to use. Maybe you will upload something there one day? For now, head to the File Menu -> 3D Models -> Get Models …   This will open the Warehouse, and allow you to select items to insert into your scene! Enter a search term (e.g. “Door”) into the Search Box at the top, press Enter, and Presto! Doors appear! Take some time to browse around, see what people have uploaded. If you find a design that you like, select it, and you will be taken to it’s Page, where you have the options to view a 3D render of it (note: can take a little while to load), or to download it into your Scene. Scrolling down should reveal other items, including collections and models that this item has been used in. I’ll not get into the complicated sections for now: Find a door you like (I’ve chosen “Flush Door” by user: “Luncai”), hit Download, and load it directly into your model.

You will notice that the door is now free-floating, and you can move it around. Find some free space, and click. Note: Do not try to place it in a doorway yet! Drop it near the house, and we’ll come back to  it …

Interlude …

SketchUp Three: Building a House

In my previous two posts (One, Two), we learnt some basic techniques for creating models in SketchUp. Now, I am going to jump directly to using these, and other, techniques to build a detailed Scene.

Don’t worry if you struggle to follow this on the first time through! You can always start over, and slowly build up bit-by-bit!

Design Stage

Firstly, it is a good idea to have a plan in mind! Sure, we could just throw a Scene together, adjusting things as we go along, but I prefer to be building towards a Goal! With this in mind, we need a Plan! Searching Google for “royalty-free house floor plans” led me to http://anyaflow.com, where I downloaded this image:

Floor Plan

You may download it directly from me by clicking to show the full Image, and then Saving to your Downloads folder.

Now we can open SketchUp, and start to build!

Start at the bottom

Base

Base

First, we need a surface to work on. Draw out a Rectangle, and size it to be a little bigger than the House will be. (In my example, we can see that the house will be 44’11” wide and 38’7″ long, so I will  make my Base 50’x40′. Remember that we can get exact dimensions by typing them!). I like to give the base some Thickness, so use the Push/Pull tool to bring it up by 1′.

Outline

Now we can start to build the outer walls.

New Tool: Tape Measure. Draw guide lines 1′ from the Right and Top edges.

Offset Tool

Offset Tool

Using these guides, and the Snap Effect, we can draw some of the outer walls. Draw a Line from the intersection of the Guides, about 40′ across the top, and 30′ down the side. Then Select these two lines (Tip: Select one, hold CTRL and Select the other). You can now use the Offset Tool to drag a 1′ ‘copy’ of the Wall. You should have something looking like this:

The Walls So Far!

The Walls So Far!

Now, using the measurements supplied (or worked-out/guessed-at!), we can fill in the rest of the walls.

I used a combination of Drawing straight lines and Rectangles, using Snap Effects, typing Measurements, and Guide Lines (from the Tape Measure tool) to produce this:

Draft Floorplan

Draft Floorplan

Cleaning Up

Now we can get rid of the Guides, and extraneous lines. The Guides are easy. Edit Menu -> Delete Guides! Trickier is erasing all of the extra lines, without clearing lines we want to keep!

Using the Eraser tool, trim the lines back, and also delete the lines “inside the walls:

Erase these bits!

Erase these bits!

We need to check that all of the Lines are connected. Select the Push/Pull tool, and hover over one of the walls. You should see that the entire wall section, and nothing else, is the familiar Spotty Blue. If this is not the case, draw over some of the lines, to make sure they are correctly aligned. You should have something like this:

Ready to Build Walls!

Now use the Push/Pull to raise the walls to exactly 8′ high.

Walls

Walls

Here is your basic building!

in Section 3a, we will move on to detailing it to actually look like a house. Doors, Windows and textures! We WILL be seeing our old friend the PushMe/PullYou again, and I will also be introducing the Sketchup Warehouse!
Until next time!

Part Three, Section 2

Sketchup – A Beginner’s Guide

Sketchup 3D design software from Trimble (previously from Google) is a very simple, yet powerful, program. Starting from basic shapes, you can build up to elaborate designs, ranging from small engineering components to vibrant cityscapes.

A lot of people are put off from using 3D design packages as they see them as complicated and fiddly, but with Sketchup, this is not true at all!

Here I would like to look at some of the most basic features, and how they can be used to create advanced designs.

I will be walking you through features, so it will help to have Sketchup running, and switch between it and this page (You know how to use ALT-TAB, yes?)

To Begin

The Opening Screen

The Opening Screen

Obviously you will need to download, install and open the program. It is available here:  https://www.sketchup.com/

Once you  have it up and running, you should see the Main Screen, with tools all around. We shall be learning what some of these tools are for.

First, though, some basic controls. I would advise trying these now, to gain some familiarity

  • The Mouse Wheel controls zooming in and out. It will focus on where the mouse pointer is, so scrolling out, and then back in can be a useful way of moving around the scene.
  • The Mouse Wheel also controls the angle you are looking from. Holding it down, and moving the mouse will rotate the camera.
  • Left-Clicking will select an Object. You can tell it is selected by the Blue border it gains. You can also do this by dragging a Selection Box around an object, but this will select EVERYTHING it contains, so use caution!

Adding Objects

The Square Tool

The Square Tool

Your scene is currently quite bare, so let’s add some features! Strangely, for a 3D program, we do not add 3D shapes. We draw 2d shapes, and extrude them. This is easier than it sounds!

Begin by selecting the Square tool, from either the Top or Left Menu. Your Mouse Pointer will change to reflect the current tool (as always). Click where you would like to begin, and move the Pointer around. You will see the Shape begin to form. If you move around enough, you may notice the useful Snap effect. Sketchup tries to guess if you wanted to line up with something, and “snaps” to be level with it. We will not use this now, but be aware of it as you go forwards.

Snap Effect in action

Snap Effect in action

In the bottom right-hand corner, you will notice the “Dimensions” area. This shows the dimensions of the Object you are creating. It also allows you to directly enter the Dimensions you would like. Try making a square 10 feet by 10 feet. Watch the Dimensions area, and do not worry about being exact. Once you have clicked to place the square, ,type “10, 10” (without quotes), and hit Return. You will notice that the square becomes exactly 10 inches by 10 inches! You must put a ‘ (apostrophe) after the number, to signify Feet! Try again! (Pro-Tip: CTRL-Z will undo your last action(s))

You can now test some of the Selection methods. Choose the Select Tool (an Arrow, like a normal Mouse Pointer), and try clicking an edge, or the face. Try double-clicking.

The Third Dimension

Cube

A Cube! (Sort of!)

You have a square, but we want a 3D object! So, select the Push/Pull Tool, and move over your Square. You should notice the face become ‘spotty’, to show that it is selected. Click on the face, and move the pointer. The face will “extrude” to form a solid. Again, note the Dimensions area. You can try to get the right height for your box, or click in approximately the right area, and then type the distance you actually wanted!

Groups and Components

Before we go further, I can’t stress enough about using Groups and Components! USE THEM! Select a complete object by treble-clicking on it with the Select Tool. This Selects all connected edges and faces. Then press “G” (for “Group”). This locks the object, allows it to be manipulated independently of the rest of the scene, and moved as one piece.

It also allows you to replicate objects without having to recreate them, using less memory and being able to edit them all at once!

If you move normal pieces together, they will connect. This is good if you want them to, but you cannot un-connect them without a lot of work. Groups or Components that touch will “Snap” together, but you can move them apart easily! They are effectively their own “mini-scenes”.

NOTE: To edit an object once it has been made a Component, you need to double-click it to “enter” the component. Or “Explode it, making ti a non-Component again.

Moving Objects and Components

The Move Tool

The Move Tool

I get a lot of use out of the Push/Pull tool, so watch closely!

Adding pieces is easy enough, especially using the “Snap” effect. Make two cubes of different sizes. Make them into Components. Click on the “Move” tool. Hovering over an object will outline it in blue to show it is selected. You can “grab” any part of it and drag it around. The Snap effect will try to guess if you are moving it along an axis, or you can hold the cursor keys to force it to lock the movement to an axis, if for example, you only want to raise the object without affecting its horizontal position.

If you “grab” an edge, or corner, you can take advantage of the Snap, and line it up with another object. Try this with your two cubes. Put the smaller cube on top of the larger. Rotate the View to make sure they are in the right place, with no gaps.

Summary

Two "cubes"

Two “cubes”

You should now be able to create and move blocks in your scene. The best idea now is to practice this, creating blocks of specific sizes, placing them together in specific ways.

Do not forget to save your work!

Have a go at this, and let me know how you get on!

The next part will deal with some other basic techniques. If you have any features you wish to know about, feel free to let me know!

Part Two

More Redesigns

To try to keep a coherent feel cross the Mad Dwarf brand, I have begun rebuilding the PC Wizard website.

Taking the main Mad Dwarf site as a template (as I have with Crystal Wizard and TechNo Prisoners), I have kept the blue and white of the original PC Wizard, giving a level of continuity.

PC Wizard

PC Wizard redesign

I still have a few details to iron out, but it has been a reasonably easy job, copying text from the existing site into the new template, and tweaking to account for the design differences.

It will soon go live, at which point there will be an announcement, and possibly a Grand Re-Opening!  Watch This Space!

Another New Redesign (Again!)

As you may have noticed, the main site, thecrystalwizard.co.uk, has undergone a redesign.

This is part of the recent re-acquisition of our Mother Site, maddwarf.co.uk. Mad Dwarf Productions (MDP) was the original “umbrella organisation” for all of my projects, but due to circumstances beyond my control, the website fell into disrepair. My recent projects sprang up without the guiding light of MDP to keep them coherent, and the designs all went in their own directions.

Now that MDP is back, I am slowly bringing all of the wayward children back into the fold. TechnoPrisoners was designed alongside MDP, and actually sits as sub-site, befitting its station as the first incarnation of MDP-Online. Crystal Wizard has now been brought in line, and the other sites will soon follow.

While I do not profess to be a Master Web-Designer, I have put no small effort into both the technical and aesthetic sides of this design, and I hope it works for you!

The colour schemes have been colour-matched, using a different scheme for each site, to represent their unique flavours, while relying on a common template. The base concept of using labelled Image Links aims to make the site both visually attractive and easy to use, giving quick recognition to each area. Rounded corners softens the look, giving a slightly more informal feel.

Behind the scenes, files have been tidied, renamed and optimised, stripping away unused clutter. The code for the pages has been almost entirely rewritten, incorporating labelled areas (DIV and SECTION tags), and many design elements moved to separate Style Sheets, for ease of maintenance.

I have tried to follow Best Practices for accessibility, incorporating ALT tags to describe images, and making the pages compatible with screen-reading technology for text-to-speech systems.

The Dark Art of SEO (Search-Engine Optimisation) has featured, but as this Alchemy involves tainting ones soul with the ever-vain search for Impressions, Clicks and Likes, I have kept it to the minimum required.

Analytics are run through Google’s offerings, tracking page hits, entry and exit pages, user flow and interactions. This anonymised data is useful for gauging interest, and locating faults, and can be used to suggest area that can use more attention.

Instead of creating a separate Style for mobile devices, the base theme has been written to automatically adjust, allowing the device to display content appropriately. An important design consideration, as people have a wide range of technologies to view the Web on, with a variety of screen-sizes available.

I hope this will lead to a comfortable, coherent experience for my readers, and welcome any feedback regarding the new design!