FAQFAQ   SearchSearch   MemberlistMemberlist   Log inLog in   RegisterRegister
Png experiments Goto page 1, 2  Next
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    Zwol.org Forum Index -> (Web)Comics Theory: ART
Previous: PostPencil Next: Posti-Quest  
Author Message
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Tue May 25, 2004 4:48 pm    Post subject: Png experiments Reply with quote

I'm doing some experiments with the png file format : I'm trying to make images that would compress well with png but badly with other formats.
I'd like to know if webcomic artists would be interessed by this kind of info.

To be more concrete RGB_cube_glue.png is a good example : a 1068x768 image that takes only 5.41 KB.
And you can print it and glue it if you want a nice RGB cube .
Back to top
View user's profile Send private message
William G
Reinvents understanding


Joined: 15 Jan 2003
Posts: 560
Location: South central...Korea. Word.

PostPosted: Tue May 25, 2004 10:11 pm    Post subject: Reply with quote

All I know is that my images sizes got smaller after I switched to PNGs... so I give them a thumbs up
_________________
Her lips are devil red, she's the color of mocha...
Back to top
View user's profile Send private message
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Wed May 26, 2004 11:20 am    Post subject: Reply with quote

If you're interessed, you can still gain 25% more file size if you want me to optimize them for you (lossless optimization, no pixel data changed, only the file size is reduced).
Did you see this post ?
Back to top
View user's profile Send private message
ragtag
Consistant Poster


Joined: 22 Jul 2001
Posts: 139
Location: Norway

PostPosted: Wed May 26, 2004 11:30 am    Post subject: Reply with quote

PNG is a great format, a lot better than GIF. But do all web browsers support it these days?

Ragnar
Back to top
View user's profile Send private message Visit poster's website
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Wed May 26, 2004 11:51 am    Post subject: Reply with quote

It depends on what you call "support".
You can safely convert gifs to png, all but the oldest browthers will be able to see them correctly. (not perfectly if you use gama correction)
The problem is with Internet Explorer : except for the Mac version, png transparency is not handled properly yet : in palette images, every semi transparent pixel is invisible, and in non palette images, the image is shown on a gray opaque background. There are IE specific javascript workarounds but it's painfull to use them. Server side solutions are also possible but no less pain to use.
Back to top
View user's profile Send private message
Greg Stephens
Forum Founder


Joined: 14 Apr 2001
Posts: 3861
Location: Los Angeles, California, USA

PostPosted: Wed May 26, 2004 12:03 pm    Post subject: Reply with quote

Most will display PNG, but MSIE doesn't yet support the coolest PNG feature- Alpha transparency. The best page for demonstrating this doesn't exist any longer (though the Internet Archive has an old copy, they didn't cache the background image, which sort of defeats the whole purpose of the page) but there are some good resources:

Start here for good overall PNG info (including a page on alpha transparency).

This page shows alpha transparency in action with a couple screenshots comparing how Opera displays it properly and MSIE screws it up (though there is a hack workaround).

This very cool page provides a few PNG transparency tests with images to illustrate the various incorrect results that could occur in various browsers.

PNG- Very cool format; Viewable in most browsers; Alpha transparency very cool, but not ready for prime-time (thanks mostly to MSIE not being ready for prime-time. Interesting how a browser's limitation becomes a limitation in the file format even though the file format is not at fault).
_________________
Good morning! That's a nice tnetennba.
Back to top
View user's profile Send private message Send e-mail Visit poster's website MSN Messenger
William G
Reinvents understanding


Joined: 15 Jan 2003
Posts: 560
Location: South central...Korea. Word.

PostPosted: Wed May 26, 2004 12:12 pm    Post subject: Reply with quote

ShadowCaster wrote:
If you're interessed, you can still gain 25% more file size if you want me to optimize them for you (lossless optimization, no pixel data changed, only the file size is reduced).

How are you doing it?
_________________
Her lips are devil red, she's the color of mocha...
Back to top
View user's profile Send private message
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Wed May 26, 2004 4:12 pm    Post subject: Reply with quote

Quote:
How are you doing it?

Depends on what "it" is : if "it" is the file optimisation, then it's running different png optimizing tools on the files and keeping the best result.
Do you want more precize info and url of the tools ?
Did you read this post till the end ?
If "it" is the automation of the directory scanning / downloading / optimizing / uploading process : I have DSL connection so my PC is always online. I've written a simple program that checks every day a list of directories on the net, download any new png in it, optimize them, and upload the result to a given ftp directory.
All I have to do is modify the the text file containing the list of web directories and corresponding ftp directory and the program takes care of the rest.
Back to top
View user's profile Send private message
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Thu Jun 03, 2004 5:06 am    Post subject: Reply with quote

If like me you used to play with your handheld calculator in college, trying to draw nice looking curves using mathematical formulas, then I wrote a script for you :
[url=http://happylandmaps.free.fr/png/experiments/rpn.php?PIX_DX=50&PIX_DY=50&ULX=-1&ULY=1&LRX=1&LRY=-1&Rmin=-1&Rmax=1&Gmin=-1&Gmax=1&Bmin=-1&Bmax=1&Amin=0&Amax=1&Hmin=&Hmax=&Smin=&Smax=&Vmin=&Vmax=&R=ANGLE+sin&G=X+Y+%2B+2+%2F+-1+*&B=ANGLE+cos&A=0&H=&S=&V=]http://happylandmaps.free.fr/png/experiments/rpn.php....[/url]

Each pixel's color is computed according to the formulas for R,G,B components, or RGBA, or HSV, or HSVA.
Most of the time, the resulting files either compress well when reencoded as optimized pngs or incredibly well with jpg encoding. 2KB exemple
It's still under developpement but gives nice results and allows easy smooth and well compressible alpha channel gradients.

If you want to see examples to figure out how to use the script or just to see nice generated images, go
http://happylandmaps.free.fr/png/experiments/rpn_urls.html
Back to top
View user's profile Send private message
Snoozer
Forum Member


Joined: 09 Jun 2004
Posts: 4
Location: Minneapolis

PostPosted: Wed Jun 09, 2004 5:44 pm    Post subject: Reply with quote

Quote:
Most will display PNG, but MSIE doesn't yet support the coolest PNG feature- Alpha transparency. The best page for demonstrating this doesn't exist any longer (though the Internet Archive has an old copy, they didn't cache the background image, which sort of defeats the whole purpose of the page) but there are some good resources:


We use png files to import Photoshop elements into our mostly flash pages. The main reason we use them is for the alpha transparency.

http://www.alpha-shade.com/www/ASpages/AS054.jpg

The first frame of the page 54 has a flash rider and mount looking down threw a set of Photoshop clouds onto a flash landscape. The png files allow you to seemly blend the two programs together.

http://www.alpha-shade.com/www/ASpages/AS055.jpg

In the lower left panel a flash gun and background are mixed in with a Photoshop explosion. It's hard to tell where one program starts and the other begins. All the clouds, smoke and dust on this page are done with pngs while the rest is FlashMX.

Using the PNG files have given us a huge amount of flexibility in our project and a big time saver as well.

CB
Alpha Shade
http://www.alpha-shade.com
Back to top
View user's profile Send private message Visit poster's website
Greg Stephens
Forum Founder


Joined: 14 Apr 2001
Posts: 3861
Location: Los Angeles, California, USA

PostPosted: Tue Jun 15, 2004 12:43 pm    Post subject: Reply with quote

A great example of overlaying partly transaparent images over other backgrounds is Delta Thrives. You can see all sorts of techniques here- jpg images, transparent gifs, table layout, CSS layout, Flash. If only the gifs were pngs instead! Even so, you should be able to see how the technique works and since png offers better transparency options than gif, you can probably extrapolate how useful it could be.
_________________
Good morning! That's a nice tnetennba.
Back to top
View user's profile Send private message Send e-mail Visit poster's website MSN Messenger
losttoy
Understands reinventing


Joined: 02 Apr 2002
Posts: 429
Location: Ann Arbor, MI

PostPosted: Sun Jun 27, 2004 4:14 pm    Post subject: Reply with quote

ragtag wrote:
PNG is a great format, a lot better than GIF. But do all web browsers support it these days?

Not mine ... i had download the mentioned cube image and open it up in a different program. I do have a recent version of explore too boot. To me, it would seem like an extra hassle that normal web viewers would not want to go through. I never have that kind of problem with .gif or .jpg.
_________________
Back to top
View user's profile Send private message Send e-mail Visit poster's website
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Mon Jun 28, 2004 2:37 am    Post subject: Reply with quote

Some IE browsers have the strange bug that they know how to handle most of the png features (except greyscale and partial transparency) but don't know that they do and react to direct png download as if it where a binary stream (even if correct mime type is sent).
But when the same png is linked from an img tag in an HTML file it's handled OK. Test this link :
http://happylandmaps.free.fr/png/RGB_cube_glue.html
Back to top
View user's profile Send private message
losttoy
Understands reinventing


Joined: 02 Apr 2002
Posts: 429
Location: Ann Arbor, MI

PostPosted: Tue Jun 29, 2004 11:03 pm    Post subject: Reply with quote

yep, it worked for me in the html ... so how do I fix the bug or do I have to grin and bear it?
_________________
Back to top
View user's profile Send private message Send e-mail Visit poster's website
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Wed Jun 30, 2004 2:10 am    Post subject: Reply with quote

If you really want to see the pngs when having their adress in the status bar, you can install the quicktime plugin that also deals with them.
Problem is that when bigger than browther's window, they get scaled down to adjust the screen (witch is nice) but you can't return to 100% zoom.
And also you won't get the Save as option, so if you want to save the image, you'll have either to search for it on your HD where the plugin stores it, or click "back" and right click the link, choose save as and redownload it, sice the plugin's cache is different from IE's cache.
Back to top
View user's profile Send private message
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Thu Jul 15, 2004 3:07 am    Post subject: Reply with quote

Well, looking at the access logs, no one really tried the [url=http://happylandmaps.free.fr/png/experiments/rpn_urls.html]
rpn image generation script[/url].
I agree that the GUI is not nice and that some math knowlege is required to use it... Never mind.
But maybe some artists would like me to make some images.
Maybe like this one :
Back to top
View user's profile Send private message
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Mon Aug 02, 2004 8:07 am    Post subject: Reply with quote

I know it's a bad habbit to revive old threads (especially since it's not the Hype thread), but I updated the page (75 KB) and still hope it might be of interest to some artist.
You think it's ugly?, useless?, incomprehensible?... Just tell me please.
Back to top
View user's profile Send private message
William G
Reinvents understanding


Joined: 15 Jan 2003
Posts: 560
Location: South central...Korea. Word.

PostPosted: Mon Aug 02, 2004 10:52 am    Post subject: Reply with quote

The checkerboard background is distracting, but the rest of it is functional. Especially for showing examples.

I'd suggest a nice neutral grey for your background
_________________
Her lips are devil red, she's the color of mocha...
Back to top
View user's profile Send private message
Greg Stephens
Forum Founder


Joined: 14 Apr 2001
Posts: 3861
Location: Los Angeles, California, USA

PostPosted: Mon Aug 02, 2004 11:16 am    Post subject: Reply with quote

It's not bad to revive old threads around here. If it was, then I'd have the forum set to delete old threads periodically.

As to the checkerboard background, it may be distracting, but it's an accepted method of displaying the background for images involving transparency.
_________________
Good morning! That's a nice tnetennba.
Back to top
View user's profile Send private message Send e-mail Visit poster's website MSN Messenger
William G
Reinvents understanding


Joined: 15 Jan 2003
Posts: 560
Location: South central...Korea. Word.

PostPosted: Mon Aug 02, 2004 10:52 pm    Post subject: Reply with quote

Ah yeah, I never considered that...

even then, I think that maybe the background could be faded out a little bit.
_________________
Her lips are devil red, she's the color of mocha...
Back to top
View user's profile Send private message
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Tue Aug 03, 2004 3:05 am    Post subject: Reply with quote

The grey checkboard is effectively the classic backgroud to "highlight" transparency, but since most of the examples do not use transparency, I added a drop down list to choose the background.
Did anyone try to generate new images with the script ?
Back to top
View user's profile Send private message
ShadowCaster
Frequent Poster


Joined: 23 Sep 2003
Posts: 93
Location: France

PostPosted: Thu Aug 05, 2004 5:20 am    Post subject: Reply with quote

I improve the GUI by adding 4 self made icons to select the color model :
RGB RGBA HSV HSVA
Also changed the default background of the example page to a hopefully less distracting light grey and blue stripe.
It still allows to visualize transparency, even if in a less obvious way than with the checkboard.
Back to top
View user's profile Send private message
William G
Reinvents understanding


Joined: 15 Jan 2003
Posts: 560
Location: South central...Korea. Word.

PostPosted: Thu Aug 05, 2004 6:23 am    Post subject: Reply with quote

thats better, it doesnt compete for the eye like the checkeboard does
_________________
Her lips are devil red, she's the color of mocha...
Back to top
View user's profile Send private message
Rip Tanion
Reinvents understanding


Joined: 12 Apr 2002
Posts: 635
Location: The Riptania Sky-Palace in da beauuuuuutiful Bronx.

PostPosted: Fri Aug 06, 2004 2:52 pm    Post subject: Reply with quote

While this is pretty interesting and all, I'm wondering: what are the practical uses for all of this?
_________________
"Park the beers, and grab the smiles. It's flight time." - LtCdr. J. Robert "Bobby" Stone, USN (R.I.P.)
Back to top
View user's profile Send private message Visit poster's website
Display posts from previous:   
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    Zwol.org Forum Index -> (Web)Comics Theory: ART All times are GMT - 5 Hours
Goto page 1, 2  Next
Page 1 of 2

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001, 2005 phpBB Group