Shop Mobile More Submit  Join Login
I haven't been too motivated for making a dress up tutorial, since there are so many of them already. One day I sorta got interested in the idea anyway. And in order to stand out in the great amount of tutorials, I decided to take the average Hapuriainen route: make it unnecessarily large. I mean, what kind of idiot draws 100+ items for a tutorial? answer: me Actually this was already started in autumn, but I didn't have the time to finish it until now.

[edit]: Fixed the game a bit, the codes should work now. Sorry about the inconvenience! Thanks to KawaiiPandah for the words of wisdom on the importing art section.
Add a Comment:
 
:iconfantazayamaya:
FantazayaMaya Featured By Owner Apr 24, 2016
I have a question, How do you add a color changer/picker? I'd like to put one in a game I've been working on but every tutorial I've tried to use only ends up not working or is terribly difficult to understand...
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Apr 25, 2016  Hobbyist Digital Artist
What do you mean by colour picker? One with buttons and pre-defined colours is fairly easy to do, while the one where you can pick any hex code (the one I use in my newer character creators) is more complex and I don't think I could explain that.
Reply
:iconfantazayamaya:
FantazayaMaya Featured By Owner Apr 25, 2016
I meant the hex code version. I understand, though. the tutorials I tried using were a bit difficult to understand, I'll try my best until I get it right!
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Apr 26, 2016  Hobbyist Digital Artist
Ah, that one. I'm afraid I can't make a step-by-step tutorial on that since it's so complicated. And the tutorial I used has been long removed, and I had to make a lot of alterations for that anyway. If you have more specific questions I can see if I can help. 

If you're going to work on this, I'd recommend you to split the problem in parts:

1) changing a movie clip's colour with a hex colour value (here's a fairly easy tutorial on that) and
2) getting the hex colour value of the pixel that was clicked.

When you get these working separately you can use the latter as an input for the former.
Reply
:iconangelfire2197:
angelfire2197 Featured By Owner Apr 2, 2016  Hobbyist General Artist
Hello! This is the most helpful tutorial I've seen. I'm trying to convert everything to AS3, but I won't ask you about that.
What I do have a question with is how you keep everything organized. 

Let's say I make a dress up game with 100 items. I separate each item into buttons for "tops", "bottoms", "shoes". each button is on it's own layer. but everything is on the same frame. 
Is it possible to make a dress up game with multiple frames for the *drawers* or not?
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Apr 3, 2016  Hobbyist Digital Artist
I don't think I understand the question. First of all, is you dress up drag&drop or operated with buttons? And what is the need to have multiple frames? None of mine have more than one frame in the main timeline (or two if you count the preloader in the first frame, but that has nothing to do with the dress up's coding).
Reply
:iconangelfire2197:
angelfire2197 Featured By Owner Apr 3, 2016  Hobbyist General Artist
The one I'm creating is Drag and Drop. But since I have so many items, they're all compiled on top of each other with the only way to sift through them being turning the layers on and off.

So I was thinking if there were a way to organize by frames instead. Like each "drawer" gets it's own frame instead of layer.
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Apr 3, 2016  Hobbyist Digital Artist
Ah, that, that's something I have to deal with as well, but unfortunately I don't think there's a good solution to it. I suppose it would be possible to dynamically load every item from the library to an empty frame, but then one would need to use the attachMovie method, which would require a lot of stupid work with coordinates, which would be a lot more work than the hassle with the frames so I wouldn't recommend it.

I just accept my fate and try to deal with this by drawing every item I want to include first and arrange them to the "drawers" only after I know I've finished drawing so I won't have to go through all the item moving and layer hiding/showing mess more than once. Also remember that the items can be on the same layer (like all shoes on the "shoes" layer instead of having a separate layer for each) if you haven't arranged them this way already.
Reply
:iconangelfire2197:
angelfire2197 Featured By Owner Apr 3, 2016  Hobbyist General Artist
Ah okay ^^ Thanks though!
Reply
:iconclock-uppers:
clock-uppers Featured By Owner Mar 15, 2016
it's best dress up totorial ever! :)

can i add export picture menu after finish my dress up and the exported file is png?
thanks
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Mar 16, 2016  Hobbyist Digital Artist
I'm afraid I don't understand the question.
Reply
:iconclock-uppers:
clock-uppers Featured By Owner Mar 16, 2016
sorry, my English is so bad

I mean, Can we add a save as picture option to save character that already dress up?
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Mar 16, 2016  Hobbyist Digital Artist
I don't know how to code that myself. I'd love to learn though.
Reply
:icontophatturtle:
TopHatTurtle Featured By Owner Mar 7, 2016
Gods, I have really tried following this tutorial 100%, and really thought I had it, sadly it doesn't work for me, and I'm not entirely sure what I am doing wrong. Would it be too presumptuous of me to ask if you have a video-tutorial? Perhaps on youtube?
It is really a simple tutorial, and you did an amazing job; I honest to gods have no idea what I am doing wrong, and I think following it step-by-step, on a clip/film would clear some things up for me.

Anyway, wonderful tutorial.
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Mar 8, 2016  Hobbyist Digital Artist
I'm afraid making videos isn't my thing (and I doubt I'd even know how to do that even if I tried). I can see if I can help if you give a description of how your dress up doesn't work for you though.
Reply
:icontophatturtle:
TopHatTurtle Featured By Owner Mar 9, 2016
You're very kind. I went through it several times and I managed to make some of it work (probably more by accident than skill, but eh) - I'm trying to do it by importing from photoshop, as I can't figure out drawing in that program.
Mainly, it's the snapping I can't get to work. I won't be able to get back to testing this upcoming week, but I'm hoping to find time next weekend; then I'll try following your directions to a T, and any problems I encounter I'll prt sc it or try to explain further.

Anyhoo, this tutorial does really seem straight forward and greatly done, so definitely kudos to you for it. May I ask, what's your background? Programming? How did you learn to work with this program?
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Mar 9, 2016  Hobbyist Digital Artist
I had no background with programming when I started making dress ups, it was just copypasting a few lines of code I found in a tutorial. Since then I've started studying computer science which has made developing dress ups and especially character creators a lot easier, but they still don't need particularly difficult codes one couldn't learn just from being a hobbyist.
Reply
:iconidellechi:
Idellechi Featured By Owner Jan 2, 2016  Student General Artist
I have a question- I want to make an object hidden at the very start of a movie, and it will show when you click the button. Currently I have it set up where if you click the shirt or pants button the dress dissapears, and when you click the dress button the shirt and pants dissapear. How do I make it so at the very start, without pressing any buttons, the shirt and pants are hidden until their buttons are pressed?
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Jan 2, 2016  Hobbyist Digital Artist
Put

_root.pants1._visible = false;
_root.pants2._visible = false;
_root.pants3._visible = false;

on a frame in the main timeline.
Reply
:iconidellechi:
Idellechi Featured By Owner Jan 3, 2016  Student General Artist
Thank you so much, it worked perfectly! :D
Reply
:iconcopianinjakakashi:
CopiaNinjaKakashi Featured By Owner Dec 29, 2015  Hobbyist Digital Artist
Hi, it's me again. I have a question about the clothes: how can you make them fit automatically the doll? This happens in your later games, I mean, you drag the item on the doll and it fits in the perfect place, witout you to find the right position for it.
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Dec 29, 2015  Hobbyist Digital Artist
Check the "snapping" part of the tutorial.
Reply
:iconphantomomega:
PhantomOmega Featured By Owner Dec 28, 2015  Student Traditional Artist
Thank you so much! This was very helpful, I learned so much. :)
Reply
:iconchibianire:
ChibiAnire Featured By Owner Dec 27, 2015
This tutorial is very very educational! Thank you!!
But...
How about character selection?
And how do you display their names?
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Dec 27, 2015  Hobbyist Digital Artist
Character selection works the same way as the hair colour buttons in the button part, it's just the gotoAndStop() code for the doll and hair movie clips.

I don't really get what you mean by displaying their names.
Reply
:iconrefinition:
Refinition Featured By Owner Dec 4, 2015
Thanks for the tutorial! Really useful. :) Just want to add something regarding the masks.

Instead of roughly drawing the shape of your item and filling it in with colour, you can just use the same png/psd image of the clothing you imported into Flash and insert that into the mask layer instead. Then go to Modify > Bitmap > Trace Bitmap and set 1/1/Very smooth/Many corners and then set that as the mask layer. The clothing will look almost exactly the same and I suppose it's easier and less messy compared to drawing the approximate shape. Hope this helps someone out there, just wanted to share! (Flash CS4, but should probably work on other versions).
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Dec 5, 2015  Hobbyist Digital Artist
Whoa, I didn't know that! That sounds really useful so thanks for telling me. I've only ever done one dress up with Photoshop graphics so I know very little of the process, but maybe I could try again some day.
Reply
:iconemiitea:
emiitea Featured By Owner Aug 10, 2015
is there a way to download the older versions of adobe flash professional for free or trial so i can get actionscript 2.0 without having to pay to install previous versions? sorry if this is a silly question. 
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Aug 10, 2015  Hobbyist Digital Artist
I'm afraid I don't really know about downloading Flash since I bought mine from a store and that was years ago. But anyway, I don't think it's legally possible to download the full version for free at least. If there's trials somewhere they should be on Adobe's website.
Reply
:iconemiitea:
emiitea Featured By Owner Aug 10, 2015
i see, well i'll have to buy flash and see if I can download previous versions, I downloaded an older version but it said I don't have access to it, which probably means I would need to pay. thanks for the help! :)
Reply
:iconekkiart:
ekkiart Featured By Owner Jul 6, 2015  Student General Artist
I'm so sorry to bother you Hapuriainen, but I simply must understand (if you have the time!) how to add colour options for multiple features (hair options for example).

so say I have Hair1, Hair2, and Hair3, and I want blue, green, red, and yellow colours for them. I undertsand how to code this for only one hair style, you would make a button for each colour (blue, green, red and yellow) and the gotoandstop code for each frame with the corresponding colour. 

HOWEVER

if the blue button (for example) says to:

 on(release){
_root.hair1.gotoAndStop(1);
}gotoandstop

but I want to change the colour for hair2, but the button is coded to hair1, and therefore when I want to change hair2 to red it suddenly pops up with a red hair1

...so do I have to create a separate colour buttons for each hairstyle? do most people do that and just use the visible/invisible code?

(Once again if you reply to this that would be beyond amazingly awesome however I probably made no sense and I know it must be SUPER frustrating replying to all these errors people have.)

xxxxxxxxxxxxxxxxxxxxxxxxxx
your tutorial is amazing and has helped me so much in making my dress up game so thankyou regardless!
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Jul 6, 2015  Hobbyist Digital Artist
You can put everything in the same button.

on(release){
_root.hair1.gotoAndStop(1);
_root.hair2.gotoAndStop(1);
_root.hair3.gotoAndStop(1);

//....
}

Then use the _visible code for hairstyle buttons to determine which style is visible.
Reply
:iconekkiart:
ekkiart Featured By Owner Edited Jul 6, 2015  Student General Artist
omg I love you so much!!!!:D:D:D ^-^ seriously thankyou soooo sooo very much, you have no idea!! This helps so much, and the fact that you replied so speedily, and even replied at all!! truly generous thank you!! 
Reply
:iconkatechi:
Katechi Featured By Owner Jun 18, 2015  Hobbyist General Artist
EH, I used your and KawaiiPandah's  tutorial and buttons still don't work D:
Reply
:iconrabbittzy:
RabbitTZY Featured By Owner Jun 15, 2015  Hobbyist Digital Artist
Is it possible to have both drag and drop and drawers?
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Jun 15, 2015  Hobbyist Digital Artist
Yes, the "drawers" section is about that.
Reply
:iconleluke:
leluke Featured By Owner May 20, 2015  Hobbyist Digital Artist
ah hello! I've already made a dress up game with click and drag, and for my next one I want to use buttons. however, I'm really new to flash, and while I've figured out how to make prev/next buttons for one set of items, I'm not entirely sure how to do it for several different sets. as in, if I already have prev/next buttons for faces, how do I make a second pair of buttons for hair. 

(I should also add that I'm using actionscript 3.0 because for some reason it won't let me use any older versions. however, I've already found a code for buttons that works in actionscript 3.0, its just that I'm not familiar enough with flash to know where to go from there.)
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner May 20, 2015  Hobbyist Digital Artist
I've never made a button for separate sets of items in AS3 so I don't know about its specifics.

Anyway, if you've made your face button so that you make the different face frames in the main timeline and your face button says something like gotoAndStop(2); or _root.gotoAndStop(2); you should rather convert the face into a movie clip, put the different faces in different frames inside it, and have your button say _root.face.gotoAndStop(2); . Then you can do the same with hair.
Reply
:iconmintcatcream:
MintCatCream Featured By Owner May 19, 2015  Hobbyist General Artist
I've made two games prior to this, but I've had the same problem every time...
After I upload the parts of the game and basically coded and arranged the items and I try to test the game out, it ends up with this:
sta.sh/0znl7qt7g1k
It happened the two previous times, though I've fixed it somehow, but this time I have no idea what I did wrong, and I can't remember how I did it before.
Any suggestions...?
;w;
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner May 19, 2015  Hobbyist Digital Artist
I can't see the error message properly, but here's some ideas:
1) are you sure you use ActionScript 2? The codes in the tutorial don't work for AS3.
2) are you sure that your code is in the movie clip and not the frame where it is?
3) it complains about an 'else' without an 'if' block before it.
Reply
:iconmintcatcream:
MintCatCream Featured By Owner May 22, 2015  Hobbyist General Artist
1) Yes, I'm 110% sure I am.
I checked first thing after I saw the error.
2) Mmmyep, I'm pretty sure they are on the movie clip.
(If you mean when you click on the image and then press f9, then yeah.)
3) I copied and pasted the code directly from the tutorial, and I checked, and there are proper if/else statements.

sta.sh/0651ghqs0o7
^There are the full error messages, if that helps...?
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner May 24, 2015  Hobbyist Digital Artist
Have you tried writing the code on your own? Copypasting directly from the tutorial has led to formatting errors in the past (though I thought I managed to weed those out years ago).

Anyway, in situations like these when you get a ton of error messages it's good to remove most of the code that doesn't work (or put it in comments /* like this */ ) because it's easier to pinpoint the error if you only have a few lines of code to work with.

Your code is on a movie clip then, and not on a Bitmap (imported art)? Though I'm not sure if Flash would even let you put code on a bitmap... Do you get an error message if you put this to a button?

on(release){
trace("Hello World!");
}
Reply
:iconmintcatcream:
MintCatCream Featured By Owner May 27, 2015  Hobbyist General Artist
Ahh, the thing is, I've made games using your code and they've worked just fine.
I've also checked it over with the other games, and they're pretty much the same.

Yes, I've imported the art, and I'm pretty sure they're all movie clips.
Aaaand I did get an error message when I tried it out.
> .>

I honestly might try to re-do everything from scratch just to make sure I haven't made any dumb mistakes...
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner May 30, 2015  Hobbyist Digital Artist
Sorry about the delayed reply.

In that case I'd duplicate one of the older works that works and change the content in the duplicate to the new stuff. If you run the game after every change you'd know at which point the error appears.
Reply
:iconmelobunii:
MeloBunii Featured By Owner Edited Apr 8, 2015  Student Digital Artist
I tried doing the next/last one, but my character is still animating and I did the stop code. Please help. This tutorial, I am not understanding this very well OTL
The name dress1? Where do I put it if i want to change the name? where do I put the original name? It doesn't say where. What item? 
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Apr 9, 2015  Hobbyist Digital Artist
I'm afraid I don't understand all your questions.

If the character is animating the stop(); code probably isn't in the right place. Double-click the character movie clip which takes you inside the movie clip, select a frame (the first one for example) in any layer, and hit F9. put stop(); in the box that pops up. A little "a" symbol should show up in the layer where you put the code.

The names that are important are the instance names of the clothes. That is different from the movie clip name. When creating a movie clip (by hitting F8 for example) the name you give it doesn't matter for these codes at all though it's recommended to name it something sensible so you can recognise the name. What is important is the instance name, which you write in the Properties panel (look in the Buttons part of the tutorial for a picture of the Properties panel).
Reply
:iconmelobunii:
MeloBunii Featured By Owner Apr 9, 2015  Student Digital Artist
I put the stop code in the right place when you click f9. it still animates, I don't have AS2, I have AS3, I wanted to do the 2 character dress up. Where I click a character name button and the character pops up. But its so confusing. I even did the drag and drop code, and it didn't work. I put them on Movie clip, and the code, and it did didn't work. Is it the type of AS I'm using?
Reply
:iconhapuriainen:
Hapuriainen Featured By Owner Apr 9, 2015  Hobbyist Digital Artist
This tutorial is for AS2, it says that in the first page of the first part of the tutorial. If you want to use AS3 you need to look for an AS3 tutorial somewhere else.
Reply
Add a Comment:
 
×





Details

Submitted on
January 22, 2011
Image Size
1.5 MB
Resolution
740×570
Thumb

Stats

Views
108,670 (13 today)
Favourites
1,927 (who?)
Comments
1,076
Downloads
1,553
×