воскресенье, 30 ноября 2014 г.

Zoom-ins art specs pipeline for Hidden Objects Games

In this topic I'll provide some practical solutions for development of zoom-ins artwork for Hidden Objects Games.

Zoom-ins, also often named as pop-ups, close-ups or pockets, are a considerable portion of artwork of any Hidden Object game and the challenges here are the following:

- place them properly in the main location
- design properly zoom-in artwork and actions taking place there
- synchronize artwork for assets being present in different zoom-ins and inventory icons artwork (you usually take item in one zoom-in and apply it in another one + all of them usually participate in multiple animations and may also be present in some extra artwork like diary entries or trophy/bonus screens)
- provide proper specs for artists, animators and programmers and do it in a proper order so that integrating the artwork and animations in game doesn't become an infinite process with still wrong result.

First of all (having a game design document describing all the actions) you analyze what zoom-ins should be included to your location. At this stage you should come to a final vision of their placement, what changes of the location artwork do actions taking place in zoom-ins will cause and if there's enough place allocated for that, take into account all the possible non-playable areas like inventory, black-bar text area, side areas that may be cut by game engine for some screen resolutions.

One more important point is that each zoom-in transition area should somehow distinguish from the background, to such extend that the player is able to intiuitively understand that he's able to zoom-in there and not have a need of pixel hunting to locate your zoom-in area. Usually we use such tricks to visually hihglight zoom-in areas as:

- light sources highlighting that area
- some animations
- a bit brighter colors for that area or somewhat more complex design of the main object in a zoom-in
- placement of zoom-in areas so that they make certain composition in an image
- make sure that there's reasonable distance between zoom-in transition areas in the main scene otherwise it'll be hard to distinguish them.
- at this stage it's also necessary to address possible complications to game designer so that he makes needed fixes

After placement of zoom-ins is defined it's time to collect photoreferences for all of them sorting them to corresponding folders, I usually collect photos for all the objects participating in scenery or actions and optionally - 3d models and/or some textures.

Suppose, I've got a ceiling lamp zoom-in where I should put a missing bulb, this means that I have to find a proper ceiling lamp that depends on the interior it's located, check if there are views already suitable for our zoom-in (if so- then just put that photo to your primary collage), then do the same for the bulb .

At the stage of primary collage make sure that:

- active objects and areas has got proper compositional placement
- they occupy enough screen space (I reccomend that each active area or object occupies not less than 1/10 of screen size)
- there's enough place for the animation of action taking place here (say, if you want to show an arm inserting a bulb you obviously need some screen space for that, especially if all of your animations and FX are played inside zoom-in frame, not on top of it)
- keep in mind that the bigger is the object you interact with or the more complex tasks are involved there - the more significant should be results of player's actions, both in visual and gameplay terms. Say, if you're going to light a candle - it's fine to use even a simple 2-frame animation "candle off - candle on", but if you're collecting 10 puzzle pieces to play a complex mini-game to open a huge gate - the visual and gameplay results should be of corresponding complexity and significance and will include both VFX for inserting each of puzzle pieces, more complex and long VFX or cutscene on successfull completion and most likely - another cutscene, probably with antagonist, in the main location, revealing another storyline hook. Knowing that you'll keep in mind that this  may need some spare space in the main location.

After you've got your primary collage (I prefer that, you can also make sketch or 3d or anything else that covers key design points - say, photo?) you have to provide specs to the artists, animators and programmers.

As final artwork is the first you have to do and what goes further to the animator and programmer - the best way to save time and efforts is to provide such a specification to the artist that doesn't give him any freedom for mistakes.

I usually provide all the layers I need in final artwork, but with more descriptive names and mark them with different colors and explain to the artist the meaning of that colors.

Example: suppose I need to make a close-up of a door lock and a simple action of opening it with a key. I've already found a suitable photo reference and now am going to provide instructions to the 2d artist who's going to post-process it:


Obviously for me, but not for every artist I need the following layers:
- 2 door parts
- another position of the door part that will open after we open the lock
- 2 chain rings you see here
- both metal details that attach the chain rings to the door
- padlock without it's upper shackle
- shackle
- add a keyhole
- add a few frames (layers) for different positions of a key opening that lock

So, what I do is cut all that staff in Photoshop and name the layers correspondingly + add some annotation:

After I've got final artwork from a 2d artist that contains all the layers listed here (non-grey ones) I'm ready to provide it to the animator and gameplay programmer:

Actions/animations:

1 - Fail: if not applying proper key or just clicking the paddle moves a bit
2 - Insert key and rotate 2-3 times
3 - Open the padlock, the chains hang down
4 - The door part moves a bit demonstrating that you've opened the door

Also, after I've got all the artwork done I check what items are applied in current zoom-in and insert that artwork to the places where we find that item (say, you could get that key at another zoom-in and it should get the same or very similar artwork and the same about the inventory icon)






Комментариев нет:

Отправить комментарий