Creating Skins/Bitmaps

Discussion in 'Building With Reaktor' started by Ctazza, Dec 4, 2005.

  1. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    I think such a thing might be possible within photoshop but I think this would require actions or scripts in java. I will not even go there because I don't get it at all and second anything on the web seems to want $$$ and I don't know if that is going to make a difference of not. Several years ago before I got into reaktor I had a buddy that did this for a living, worked on Shrek and stuff like that I really wish I still had contact with him.
     
  2. loadammo

    loadammo NI Product Owner

    Messages:
    333
    This:

    http://home.arcor.de/martin.deimos/downloads/rotate_layer.rar
     
  3. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    Thanks Loadammo +1:D

    yes and no. It does rotate just fine everything must be planed form the center. If you try to rotate the entire knob which is never a good idea it will come out deformed. Will require a good deal of editing. However, it you don't like the knobman this is a good solution. For all intents and purposes I think that the panel elements we see on Waves,Motu, and logic plug are most likely done in a program like Autodesk Maya or simular programs. At least that is what I read on KVR from the guy that does the graphics for Audiodamage plug-ins.

    There still seems to be some fuzzy and distorted edges on certain knobs sizes even when its all done in PHshop but is better then resizing in other programs by far.
     
  4. loadammo

    loadammo NI Product Owner

    Messages:
    333
    Yeah, I should have said it's not the complete and final answer (It actually doesn't work in CS3, the buttons weren't clicking for me..)

    But armed with the javascript reference you should be able to bang something out. I wrote a script that did this a while ago but got bored of writing it.

    The only 'gotcha' I remember was that when you cut something from a layer with transparency if it's floating somewhere inside the bounds of the canvas when you paste it, it gets centered on the target layer by the bounds of the selection, instead of being able to 'select all' and cut/paste it in the same position it was in the previous selected layer.

    Aside from that it's just rotate and pasting and rendering out the image.
     
  5. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    Perhaps that was the problem I am on CS3. As far as code goes I am quite lost. I think looking into java would noly confuse me more then I am.
     
  6. Paule

    Paule NI Product Owner

    Messages:
    7,399
    tubaman, if you're on pc and cs2 you can use otiumfx rendering 3 free for rotating knobs.
     
  7. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    If you are using knobman to make the rotations, try rotating and exporting seperat layer (try not to add anything to complex shapes unless that is what you want for sure, just rotate the plain shape without anything works best with polygons since they are very difficult), Then manage the layers in Photoshop. I did some real nice stuff with that approach this evening. Gradiants will not work well nor filter unless you break each knob rotation down to a single frame then apply the filter or gradiant. However, Beveling and layering up bevels espec. on complex shapes does a really nice job. It is also a good place to add the shadow effects. However it might take some doing to get everything lined up, it was a bit of a pain on indicators. I have been doing this but with the bevel and gradiant already applied. It didn't occur to me to leave everything out on the raw image rotate that and then do the beveling after it rotated. Cheers. No matter what its still a pain in the back-side.
     
  8. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    new version of knobman is out its worth the time to get many improvments and better performance.
     
  9. Paule

    Paule NI Product Owner

    Messages:
    7,399
    Thanks a lot, Jonathan.
     
  10. tubaman

    tubaman NI Product Owner

    Messages:
    789
    no I'm on Mac with Cs2. I can't believe there's no inexpensive software for mac to do knobs ! (?) wtf
     
  11. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    do you still have my e-mail? Send the PNG, or better yet the PSD, to me or post them and I will do it for you if you like.
     
  12. loadammo

    loadammo NI Product Owner

    Messages:
    333
    Here's a modified version of 'rotate layer' that works in CS2 and CS3 -- the trick is you have to manually edit it to modify the frames/degrees/rotation direction, but otherwise it works great.

    Basically a no UI version of 'knobman' for free.
     

    Attached Files:

  13. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    This is for beginners and novice Photoshop CS3 users. I have made a simple demo using layers that would help you create skin for instrument panels. This is the way that I would begin building up layer any skin or panel element. Don't know if it will help but here it is anyway.
     
    Last edited: May 7, 2008
  14. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    I am breaking my self imposed ban for my lack of maturity but I felt this is important and perhaps will help those that have wanted to do 3D modeling themselves as I know many have tried and given up. Don't its worth the aggravation. I have worked it out so that it is rather easy to get to the point that you have to load all the PNG images into a graphics program to make a strip.

    My first suggestion: do not do the modeling in Blender. Try Silo 3D model it is very easy and intuitive. It makes quick work of the modeling. Save often to different files heading so that you can always abandon changes and go back to early models when inspiration hits its easier then having to re-model everything. Do as much of the work as you can without subdivision use this only to check you work in progress. Plan ahead so that you can create the proper object for what you will want to do, I found this to be very important. Refine mesh and export as .obj file.

    Now that that is out of the way open Blender. Delete the cube and camera. Import your .obj file (s) and then add a mesh -> plain in the top view mode. Scale the plain to give a nice area around the panel element you just imported because it is what will have your shadows in the final animation. Use the perspective view to adjust the plain just under the panel element. Now add material to the plain by using the add icon and name it. Find the “shade” section and toggle only shadows. Go to the picture mode which as your settings for the animation/rendering. Set the file type to PNG and in the Render section toggle “Key” now you are all set to have an alpha channel on the background with shadows, only the shadows will be visible on the background.
    Return to you top view and add a camera (this will place the camera on the z axis). Return to perspective view and place the camera along the z-axis so that the knob and background needed are correct (you can always use the render to check but I suggest the camera view and then inside square will give you the best indication. Also set up the lamp where you want it.

    Now that this is set do the animation. It is very easy but I am not going to go into that here, although it is best if you view the timeline in frames.

    All set good.

    Go back to the picture mode and find the output file for the png files. Put them where you will want them and name it, beware that whatever you name it 0001 etc for each animation in the sequence will be added to that title.
    Use the animate button and when that is finished save a rendering of that with the F3 key. I use this render to scale the canvas size in Photoshop if I need to make further adjustments. You will now have the laborious task of loading all those PNG frames into a strip in your graphics program.

    What are the benefits of this process? The final strip that you use to make you knobs will be very clear with resizing. It will look very realistic (if that is your goal) and believable. But it’s most the clarity with resizing and with the knobs appearance in general. So far it feels very comfortable when it is done.
    See attachments below for setting up the Alpha on the background with shadows cast. And see the pic for the final result (note that I added the background layer in photoshop). I have also uploaded a Blender file that has everything set up, materials are add, camera and lamp adjusted, the knob is animated. Basically all you have to do is assign and output file for the animations and render it (use animation button).

    I hope this will help for those that have an interest in Blender and that it will make some of the fustrating aspects of it a bit more manageable.

    Good luck.

    Cheers

    Jonathan
     
    Last edited: Jun 17, 2008
  15. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    Last edited: Jun 17, 2008
  16. Paule

    Paule NI Product Owner

    Messages:
    7,399
  17. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    For those with Photoshop CS3 I uploading two PSD files that of the skin pictured below. I have included the FX as well so that there is a reference for how various layers interact with each other. Its as close to step by step as i would dare get.
     
    Last edited: Dec 18, 2008
  18. tubaman

    tubaman NI Product Owner

    Messages:
    789
    are these specific to PS3? Can they be saved as PS2? -that's what currently use :)
     
  19. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    its for CS3 I don't think I can save it into a lower version, not that I see at least or that I know of. It wouldn't be of much use if one can not see all that work on the basic shapes.
     
  20. Horuschild

    Horuschild NI Product Owner

    Messages:
    1,635
    a knobman file for a 3D look in knobman.

    Includes knobman file, tga strip and reaktor example. Keep in mind that this will make the native label and value display useless requiring a custom one. It also require moving the shapes around so layers that rotate will require you to change the center of the rotation as well. complex knobs will be very difficult this way.
     
    Last edited: Dec 18, 2008