Print Reseller Scheme
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

How do I combine a JPEG and a PNG, to make a single PNG? (App Store icon)

Discussion in 'Graphic Design Forum:' started by HelpMeCode, Jan 31, 2012.

  1. HelpMeCode

    HelpMeCode New Member

    Please have a look at this page in your web browser:
    App Store - Downcast

    The red Downcast icon is actually a JPEG with a PNG on top of it.

    The JPEG: http://a4.mzstatic.com/us/r1000/114/Purple/9f/91/6a/mzl.xbcfxpci.175x...

    The PNG: http://r.mzstatic.com/htmlResources/9A0B/images/mask175.png

    I would like to just get the resulting image, with the alpha
    transparency effect. I need to get a SINGLE file, a PNG.

    Now, tools at my disposal:

    1. Preview.app : I could try using the Instant Alpha, I know how to do
    that.
    2. Fireworks: I have been experimenting for hours, creating new
    layers, using 'paste as mask' etc. I can't seem to get all the
    elements in the correct order.
    3. PhotoShop: I gave up. FireWorks seemed a bit more appropriate.

    Please, please, someone help me? (And hi, i'm new!)
     
  2. spottypenguin

    spottypenguin Active Member

    Errrr draw the whole lot in Illustrator and export as a PNG??? It's actually not that difficult (if you know the software that is).
     
  3. divarien

    divarien New Member

    work on Photoshop file save it as png from 'save as' option ! as simple as that.
     
  4. ARRIVALS

    ARRIVALS Well-Known Member

    If you notice, he said he didn't have Illustrator ;)

    Never used Preview.app or Fireworks so no idea what they can do, but that icon is easily done in Photoshop, using different layers, layer effects and transparency settings.

    1st thing to do. - Create a blank document, obviously a square one. (You'll see grey and white checkered squares).
    2nd thing to do. - Create a rounded cornered square. Fill it red or add the light to dark gradient instead.
    3rd thing to do. - Create the lined sunshine effect. I've only ever done that in Adobe illustrator, but you can do that in Photoshop using the pen tool. You'll have to do each branch separately I think. Once you have one, you'll need to duplicate it a load of times, then obviously turn each of them round to get them in a circle. Once you have them done, merge them all into 1 layer. From this point you could either select one of the layer effects, or use the transparency filter to turn it see-through.
    4th thing to do. - Use the type tool to create the 'D' and the pen tool again to create the 2 sound-waves. Merge the 2 sound-wave layers together then add a drop-shadow.
    5th thing to do. - Save it as a PNG.

    Hope that helps.
     

Share This Page