Hi !
Featured games (90)
games approved by the League of Dukes
Games in Showcase (791)
Games in Android Showcase (234)
games submitted by our members
Games in WIP (864)
games currently in development
News: Read the Java Gaming Resources, or peek at the official Java tutorials
    Home     Help   Search   Login   Register   
Pages: [1]
  ignore  |  Print  
  How to draw a 2D-bridge  (Read 13584 times)
0 Members and 1 Guest are viewing this topic.
Offline JFixby
« Posted 2012-11-27 13:03:39 »


Today I’ll tell you how to draw a simple 2D bridge for a videogame.

Firstly you need to make a few simple sketches like these:

The main point of the sketches is to provide us a chance to think about the details of our bridge, like: fasteners, screws, couplings, fences, torches and so on. Such details attract a lot of attention of a human brain, so it gets bored when it can’t find them on your picture. We can effectively enrich our sketch with details from Google Image Search and then draw sections of out bridge:

Firstly we draw the left side, then copy it and flip to get the right side. Generally it is a bad idea to copy stuff, but in our example as long as we are doing a simple object (bridge) we can allow it. Second, we draw the middle section. Keep it symmetrical, because we plan to duplicate it for creating bridges of a different length.

In this example you don't really need the digital tablet. You can just use your mouse and the Shift-key. Press Shift to draw straight lines (dragging the mouse), or to connect two clicks with a straight line (there are people who don’t know about this feature).

Drawing each step we should save our intermediate results by making mini-backups. Later we can use them in case we mess up, or reuse it for other drawings. To make the mini back-up drag all your layers in the “folder”-button and then drag the folder in the “new layer”-button. Here is the duplicated stuff:

Now we should block original folder using the “black-lock” and make the folder invisible to protect it. Then we use the duplicate folders content to build a 4-sections instance of our bridge:

Don’t forget to mini-backup it too. Also you can save your drawing in a separate files when you work on something huge like the game level I was showing you last time. That level is a picture 14000 pixels wide, I saved every few hours in a separate file calling it something like public_demo_level_0047.psd and uploaded to DropBox.

Now coloring. We need 3 layers (I list them down- up):
3) White background
2) Lineart – with opacity 60%
1) and a layer (called “color”) in the “Multiply” mode.
Two lower layers we block (using black locks) and the “color”-layer we paint with any neutral color:

Press Ctrl+U, play some time with hue and saturation, then add some volume by drawing shadows:

Now you can play a bit using texture brushes:

That's it. Here we are.

Looks quite simple because we are drawing just a simple bridge, there is nothing special about it Smiley

(Here is the same tutorial but with bigger images:

my dev log:
Offline Pickleninja

JGO Coder

Medals: 10
Projects: 1

I'm tired of working for someone else.

« Reply #1 - Posted 2012-11-27 13:19:15 »

That's awesome!

I was thinking about how to do bridges, thanks for the tutorial! Smiley


Offline masteryoom

JGO Coder

Medals: 5
Projects: 2

If you look closely, you might see it turning...

« Reply #2 - Posted 2012-11-29 09:07:58 »

What are you using?

Games published by our own members! Check 'em out!
Legends of Yore - The Casual Retro Roguelike
Offline JFixby
« Reply #3 - Posted 2012-11-29 16:15:18 »

You can use Photoshop and Gimp for this

my dev log:
Pages: [1]
  ignore  |  Print  

hadezbladez (2894 views)
2018-11-16 13:46:03

hadezbladez (1046 views)
2018-11-16 13:41:33

hadezbladez (2846 views)
2018-11-16 13:35:35

hadezbladez (560 views)
2018-11-16 13:32:03

EgonOlsen (3839 views)
2018-06-10 19:43:48

EgonOlsen (4256 views)
2018-06-10 19:43:44

EgonOlsen (2552 views)
2018-06-10 19:43:20

DesertCoockie (3367 views)
2018-05-13 18:23:11

nelsongames (3480 views)
2018-04-24 18:15:36

nelsongames (4492 views)
2018-04-24 18:14:32
Java Gaming Resources
by philfrei
2019-05-14 16:15:13

Deployment and Packaging
by philfrei
2019-05-08 15:15:36

Deployment and Packaging
by philfrei
2019-05-08 15:13:34

Deployment and Packaging
by philfrei
2019-02-17 20:25:53

Deployment and Packaging
by mudlee
2018-08-22 18:09:50

Java Gaming Resources
by gouessej
2018-08-22 08:19:41

Deployment and Packaging
by gouessej
2018-08-22 08:04:08

Deployment and Packaging
by gouessej
2018-08-22 08:03:45 is not responsible for the content posted by its members, including references to external websites, and other references that may or may not have a relation with our primarily gaming and game production oriented community. inquiries and complaints can be sent via email to the info‑account of the company managing the website of java‑
Powered by MySQL Powered by PHP Powered by SMF 1.1.18 | SMF © 2013, Simple Machines | Managed by Enhanced Four Valid XHTML 1.0! Valid CSS!