Jump to content


Design Theory and Practice


1541 replies to this topic

#1 Dark Knight

    Shadow of the Ducks

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 62,085 posts

Posted 02 May 2006 - 06:50 PM

Since there are so many who design signatures and avatars on AD, I decided to start a topic where you can ask and answer questions relative to design. Ask anything about design theory or practice, software, post tips, personal preferences etc and maybe we can all learn a bit from each other.

Who's got a question?

#2 Ducksfreak93

    Teemu!

  • Members
  • PipPipPipPipPipPip
  • 1,621 posts
  • Location:Saskatchewan

Posted 02 May 2006 - 06:56 PM

QUOTE(Dark Knight @ May 2 2006, 08:50 PM)
Since there are so many who design signatures and avatars on AD, I decided to start a topic where you can ask and answer questions relative to design. Ask anything about design theory or practice, software, post tips, personal preferences etc and maybe we can all learn a bit from each other.

Who's got a question?

View Post




5x-3=8+4 ??? Sorry alg really gets at you. biggrin.gif I think I pretty well off right now so at the monent I will not have any questions.

#3 Tomato Assasin

    Hall of Famer

  • Members
  • PipPipPipPipPipPipPipPip
  • 3,714 posts
  • Location:England

Posted 02 May 2006 - 07:04 PM

This is a great idea DK!! smile.gif I have one..what software do you use DK? and if you use photoshop....how do you create the "lines" (like on a tv) across the sigs that you make. For example in your sig you have them across both your pictures. Also what programs do you use thedux02?

#4 Dark Knight

    Shadow of the Ducks

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 62,085 posts

Posted 02 May 2006 - 08:13 PM

I mainly use Photoshop for sigs. Now how to make the lines, the simplest way in Photoshop:

1. Start with the image you want to lay the lines over.
2. Create a new layer above it
3. Create a second new image 4 pixels wide by 2 pixels high on a transparent background.
4. Zoom in on this image up to 1600%
5. Use the pencil tool at 1 pixel and draw a straight line across (hold the Shift) in the color of your choice
6. Go to Select / All
7. Go to Edit / Define Pattern (click ok)
8. Go the image you started with and do Edit / Fill / Pattern / Custom Pattern
9. From the layers tab select Overlay (or any other of the choices)

You're done.

#5 Francaise

    Hall of Famer

  • Members
  • PipPipPipPipPipPipPipPip
  • 3,684 posts

Posted 02 May 2006 - 08:32 PM

This is not a question, just a comment. Great job you guys do, many thanks...........

#6 DropThePuck

    Still a rollercoaster ride. Sigh ... Go Ducks!

  • Admin
  • 62,539 posts

Posted 02 May 2006 - 08:43 PM

I'll second your kudos Francaise! clapping.gif

These folks are the best! It's all magic, smoke, mirrors, and hand waving to me. worshippy.gif

#7 MrsBevo

    Hockeyaholic

  • Mods
  • 7,780 posts

Posted 02 May 2006 - 08:50 PM

Ducksfreak, x = 3

I would also like to say thank you for the wonderful artwork you guys have created. Without it, I would be without a signature.

DTP - nice observation of the Power Player situation last night. I thought they weren't supposed to interact with one another, but I guess pointing out the extra ice piles is ok.

#8 Jennifer1515

    AKA T-PoP

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 6,850 posts
  • Location:limbo

Posted 02 May 2006 - 09:52 PM

QUOTE(MrsBevo @ May 2 2006, 11:50 PM)
Ducksfreak, x = 3

I would also like to say thank you for the wonderful artwork you guys have created.  Without it, I would be without a signature. 

DTP - nice observation of the Power Player situation last night.  I thought they weren't supposed to interact with one another, but I guess pointing out the extra ice piles is ok.

View Post




actually they showed that on the OLN feed last night laugh.gif


oh...and I LOVE my Shane O'Brien sig DK made me hug.gif

#9 Duckette

    Goalie Girl

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 8,155 posts
  • Location:Hockey Bay, USA

Posted 02 May 2006 - 09:58 PM

I have a Q for TA.

How do you get the big Geometrical shapes in your sigs? You've had triangles in the corners, and the thick border. How do you do it? And I only have PSP9 tongue.gif

#10 Aeryn

    Mistress of :eyebrow:

  • Members
  • PipPipPipPipPipPipPipPip
  • 4,339 posts

Posted 02 May 2006 - 10:00 PM

QUOTE(Jennifer1515 @ May 2 2006, 09:52 PM)
QUOTE(MrsBevo @ May 2 2006, 11:50 PM)
DTP - nice observation of the Power Player situation last night.  I thought they weren't supposed to interact with one another, but I guess pointing out the extra ice piles is ok.

actually they showed that on the OLN feed last night laugh.gif

Okay, I hate to take this thread OT...but what the heck are you guys talking about?


#11 Duckette

    Goalie Girl

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 8,155 posts
  • Location:Hockey Bay, USA

Posted 02 May 2006 - 10:03 PM

QUOTE(Aeryn @ May 2 2006, 10:00 PM)
QUOTE(Jennifer1515 @ May 2 2006, 09:52 PM)
QUOTE(MrsBevo @ May 2 2006, 11:50 PM)
DTP - nice observation of the Power Player situation last night.  I thought they weren't supposed to interact with one another, but I guess pointing out the extra ice piles is ok.

actually they showed that on the OLN feed last night laugh.gif

Okay, I hate to take this thread OT...but what the heck are you guys talking about?

View Post



Its ok, I wanna know what they're talking about too! laugh.gif

#12 Dark Knight

    Shadow of the Ducks

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 62,085 posts

Posted 03 May 2006 - 05:13 AM

Please don't take this thread OT. I'd really like this to be someplace where the AD designers can have a Q&A forum.

Thanks smile.gif

#13 Ducksfreak93

    Teemu!

  • Members
  • PipPipPipPipPipPip
  • 1,621 posts
  • Location:Saskatchewan

Posted 03 May 2006 - 05:18 AM

QUOTE(MrsBevo @ May 2 2006, 10:50 PM)
Ducksfreak, x = 3

I would also like to say thank you for the wonderful artwork you guys have created.  Without it, I would be without a signature. 

DTP - nice observation of the Power Player situation last night.  I thought they weren't supposed to interact with one another, but I guess pointing out the extra ice piles is ok.

View Post





Thanks I just made that one up. Maybe I should of used one from the textbook. eyebrow.gif

#14 Tomato Assasin

    Hall of Famer

  • Members
  • PipPipPipPipPipPipPipPip
  • 3,714 posts
  • Location:England

Posted 03 May 2006 - 06:37 AM

QUOTE(Duckette @ May 3 2006, 05:58 AM)
I have a Q for TA.

How do you get the big Geometrical shapes in your sigs? You've had triangles in the corners, and the thick border. How do you do it? And I only have PSP9 tongue.gif

View Post



For the geometrical shapes in my sigs i create lines using the line tool and then fill it in with the paint bucket tool. And for the borders i usually just create a new layer and fill it in with the paint bucket tool and then "hollow" out the middle by selecting and then deleting the majority of the filled out layer to leave a border, or i'll use the line tool and set the lines to be thicker than usual to give it a border. Then i'll sometimes add effects and other features. I'm sorry if its not as easy to do this in you program (im using photoshop cs). smile.gif

#15 Duckette

    Goalie Girl

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 8,155 posts
  • Location:Hockey Bay, USA

Posted 03 May 2006 - 01:42 PM

QUOTE(Tomato Assasin @ May 3 2006, 06:37 AM)
QUOTE(Duckette @ May 3 2006, 05:58 AM)
I have a Q for TA.

How do you get the big Geometrical shapes in your sigs? You've had triangles in the corners, and the thick border. How do you do it? And I only have PSP9 tongue.gif

View Post



For the geometrical shapes in my sigs i create lines using the line tool and then fill it in with the paint bucket tool. And for the borders i usually just create a new layer and fill it in with the paint bucket tool and then "hollow" out the middle by selecting and then deleting the majority of the filled out layer to leave a border, or i'll use the line tool and set the lines to be thicker than usual to give it a border. Then i'll sometimes add effects and other features. I'm sorry if its not as easy to do this in you program (im using photoshop cs). smile.gif

View Post



LOL It's ok, my mom might let me get CS2 when we move. IDK If she will, but it's something I enjoy and might want to make a career out of tongue.gif

Thanks!!!

#16 Thind06

    Unsung Hero

  • Members
  • PipPipPipPipPipPipPipPip
  • 3,801 posts
  • Location:Montreal,Laval,QC
  • Interests:Los Angeles Angels of Anaheim(i still say Anaheim Angels),New England Patriots,Washington Wizards, and the Anaheim Mighty Ducks

Posted 03 May 2006 - 04:24 PM

i have adobe photoshop cs2
i was wondering what was the difference between adobe image ready and photoshop?

#17 PortBeach13

    Duty. Honor. Country

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 13,478 posts
  • Location:Classified

Posted 03 May 2006 - 05:01 PM

1. I'd like to say thanks to DK, TA, thedux02 making me awesome sigs. Keep up the good work thumbsup.gif

2. Is there any software that is free and that I can download? Like can I make sigs etc with a free software?

#18 Dark Knight

    Shadow of the Ducks

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 62,085 posts

Posted 03 May 2006 - 08:57 PM

QUOTE(Thind06 @ May 3 2006, 05:24 PM)
i have adobe photoshop cs2
i was wondering what was the difference between adobe image ready and photoshop?

View Post


I think TA can answer that question better, but ImageReady is used mainly for gif animations. Right TA? Maybe you can talk a little about how you do animated gifs?

#19 Jennifer1515

    AKA T-PoP

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 6,850 posts
  • Location:limbo

Posted 03 May 2006 - 09:27 PM

QUOTE(Dark Knight @ May 3 2006, 11:57 PM)
QUOTE(Thind06 @ May 3 2006, 05:24 PM)
i have adobe photoshop cs2
i was wondering what was the difference between adobe image ready and photoshop?

View Post


I think TA can answer that question better, but ImageReady is used mainly for gif animations. Right TA? Maybe you can talk a little about how you do animated gifs?

View Post




how about MS Paint.... laugh.gif

rolleyes.gif

#20 Duckette

    Goalie Girl

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 8,155 posts
  • Location:Hockey Bay, USA

Posted 03 May 2006 - 09:31 PM

QUOTE(Jennifer1515 @ May 3 2006, 09:27 PM)
QUOTE(Dark Knight @ May 3 2006, 11:57 PM)
QUOTE(Thind06 @ May 3 2006, 05:24 PM)
i have adobe photoshop cs2
i was wondering what was the difference between adobe image ready and photoshop?

View Post


I think TA can answer that question better, but ImageReady is used mainly for gif animations. Right TA? Maybe you can talk a little about how you do animated gifs?

View Post




how about MS Paint.... laugh.gif

rolleyes.gif

View Post



rofl.gif I can answer that:

MS Paint = CRAP

PSCS2 = AWESOME! biggrin.gif

#21 Jennifer1515

    AKA T-PoP

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 6,850 posts
  • Location:limbo

Posted 03 May 2006 - 09:53 PM

QUOTE(Duckette @ May 4 2006, 12:31 AM)
QUOTE(Jennifer1515 @ May 3 2006, 09:27 PM)
QUOTE(Dark Knight @ May 3 2006, 11:57 PM)
QUOTE(Thind06 @ May 3 2006, 05:24 PM)
i have adobe photoshop cs2
i was wondering what was the difference between adobe image ready and photoshop?

View Post


I think TA can answer that question better, but ImageReady is used mainly for gif animations. Right TA? Maybe you can talk a little about how you do animated gifs?

View Post




how about MS Paint.... laugh.gif

rolleyes.gif

View Post



rofl.gif I can answer that:

MS Paint = CRAP

PSCS2 = AWESOME! biggrin.gif

View Post




hey now thats what i "doctor" all my stats sheets with...ha ha ha laugh.gif
but maybe because Im doing good if I can figure out how to start my computer laugh.gif rolleyes.gif

#22 Tomato Assasin

    Hall of Famer

  • Members
  • PipPipPipPipPipPipPipPip
  • 3,714 posts
  • Location:England

Posted 04 May 2006 - 07:22 AM

QUOTE(Dark Knight @ May 4 2006, 04:57 AM)
QUOTE(Thind06 @ May 3 2006, 05:24 PM)
i have adobe photoshop cs2
i was wondering what was the difference between adobe image ready and photoshop?

View Post


I think TA can answer that question better, but ImageReady is used mainly for gif animations. Right TA? Maybe you can talk a little about how you do animated gifs?

View Post



Photoshop is mainly just the doctoring of images and imageready has most of photoshops features while it lets you create links, rollovers and animations, and it optimizes your graphics for the web. The software actually creates HTML pages for you, and includes all of the necessary code, such as table definitions, image maps, links, and JavaScripts, to implement a website.

More on the differences between photoshop and imageready can be found Here

How to use Imageready for animations

I use it for animations and to do this you open imageready and straight away you'll see a toolbar at the bottom that says 'animation' on it. This is the main thing that you will use to make the sig (assuming thats what your animating) animate.

To get your .psd file in imageready either open it in imageready or you can do that by going 'file', 'edit in imageready' or by clicking on the bottom button on the far left ('tools') toolbar in photoshop. Now once your file is open in imageready, the only real toolbars and features you'll need to use are the 'layers' and 'animation' toolbars.

In the animation toolbar you'll notice that the file you have opened in imageready is being shown as a small picture under the number 1 in the animation toolbar. This is frame no.1 and is the first frame in the animation. Under the picture in this toolbar you should see something like a number with sec written beside it. This is the amount of time the frame will be shown in the animation. This can easily be changed by clicking on the number and then choosing another amount of time. Below this are 8 buttons.

The first is one which probably says forever on it. You can use this to choose how many times it repeats in the animation (once, forever or a selected amount of times). I have never used this feature as usually you'll want the animation to repeat forever.

The next four buttons are used to play,flick through, pause and rewind the animation you have made. This very useful as it previews your animation and it shows how fast each frame is shown in the animation (for example you may have made a mistake on how fast you want one frame to go and it can easily be shown when you play the animation).

The next button should look like 4 circles. This button is used to make an animation between two frames (e.g. fading one frame to the next. for example in the selanne avatar i made for jason, you may notice that from the picture with selanne in the team photo it fades from that to his name. That is done through the use of this feature.) You can choose how many 'fading' frames you have as this can lead to a small or large fade. When you choose this option you'll see quite a few other options. Basically i use the amount of frames option and thats about it, i just leave the others as default. To use this you should select the frame (by clicking on it) that you want to have previous frame fading to.

The next button looks like a square and is the new frame button. This basically duplicates the one you have selected and makes you a new frame for your animation.

The frame following this one looks like a trash can and deletes the selected frame when clicked. These are basically the only things you need to learn for making animations in sigs.

If you want to create a sig or avatar that simply skips from one picture to another without any other effect you should create a new frame for each picture or pictures you want in each individual frame (by choosing whether they are shown in the layers toolbar or not), so for one frame select the layers you want shown in it and then in the next frame do the same (remember to deselect the layers you don't want in the new frame).

If you want to animate from one frame to the next use the 'fading' button which is mentioned earlier. There are lots of different ways to use this feature.

To save your animation as a gif you go 'file', 'save optimised as' and then name it something and then you have your gif and animating sig.

So basically to learn to use imageready in the way i've said, you should make a photoshop file with lots of contrasting layers and then put it into imageready and muck around with all the features in the animation toolbar, just go through them all and you should get the hang of it in no time because other than the animation toolbar its basically the same as photoshop.

If you have any questions about how to make a certain animation or anything else, just ask and i will be glad to help. smile.gif

#23 Dark Knight

    Shadow of the Ducks

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 62,085 posts

Posted 04 May 2006 - 07:37 AM

Awesome TA! Thanks for taking the time. I'm going to practice this sometime.

#24 Tomato Assasin

    Hall of Famer

  • Members
  • PipPipPipPipPipPipPipPip
  • 3,714 posts
  • Location:England

Posted 04 May 2006 - 08:04 AM

QUOTE(Dark Knight @ May 4 2006, 03:37 PM)
Awesome TA! Thanks for taking the time. I'm going to practice this sometime.

View Post



No problem!! I actually wrote this as a reply to TMDM who wondered how to use imageready as well, so it was a good idea that you made this thread, so it could be shared smile.gif Yeah i recommend that you do try it, its great fun!! smile.gif banana.gif

#25 jojo983

    Stanley Cup Champion!

  • Members
  • PipPipPipPipPipPipPipPipPip
  • 8,963 posts

Posted 04 May 2006 - 09:15 AM

I love this thread! Thanks for posting the helpful guides DK and TA. When I finish my 5 assignments and my 2 exams I will start trying stuff out. smile.gif





1 user(s) are reading this topic

0 members, 1 guests, 0 anonymous users