[X3D-Public] X3D Scene Authoring Hints: Images

Don Brutzman brutzman at nps.edu
Sun Aug 15 18:34:16 PDT 2010


I updated a few points in the following guidelines and thought
they might be of general interest.  Comments and improvements are welcome.

     
http://www.web3d.org/x3d/content/examples/X3dSceneAuthoringHints.html#Images


      _Images_

    * An excellent open-source image editor is the GNU Image
      Manipulation Program (GIMP) <http://www.gimp.org>.
    * Do not add images to the open-source archives without proper
      permissions and Credits
      <http://www.web3d.org/x3d/content/examples/X3dSceneAuthoringHints.html#Credits>.

    * Follow Naming Conventions
      <http://www.web3d.org/x3d/content/examples/X3dSceneAuthoringHints.html#NamingConventions>
      for image file names: no abbreviations, CamelCaseNaming, no
      embedded whitespace or underscore characters, etc.
          o Don't arbitrarily rename images provided from other sources.
          o Starting with the same name as the scene of interest helps
            directory alphabetization.
          o Ensure that filename extensions are lower case (e.g.
            |CoolImage*.png*| vice |CoolImage.*PNG*)|.
    * Choice of image file formats:
          o Portable network graphics (PNG)
            <http://www.w3.org/QA/Tips/png-gif> is the preferred image
            format for capturing screen images, providing the best
            support for lossless compression and transparency.
          o Joint Photographic Experts Group (JPEG)
            <http://www.jpeg.org> format is also excellent. The
            preferred file extension is |CoolImage*.jpg*|. JPEG is the
            best choice for photographic images since it captures color
            gradations exceptionally well. Be careful to evaluate
            results when modifying JPEG compression quality, since it is
            lossy and highest image quality is often best. Note that
            JPEG does not support transparency
            <http://www.faqs.org/faqs/jpeg-faq/part1/section-12.html>.
          o Tagged Image File Format (TIFF)
            <http://en.wikipedia.org/wiki/Tagged_Image_File_Format> is a
            high-quality format for images, photographs and line art.
            However it is proprietary and not always supported.
          o /Avoid/ using Graphics Interchange Format (GIF)
            <http://www.w3.org/Graphics/GIF/spec-gif87.txt> if possible.
            It is technically inferior, larger size, and has licensing
            encumbrances. Rationale: PNG versus GIF
            <http://www.w3.org/QA/Tips/png-gif> considerations.
    * Many other image file formats
      <http://en.wikipedia.org/wiki/Image_formats> exist. The best
      authoring practice is to use GIMP <http://www.gimp.org> to convert
      the original image into |.png| or |.jpg| format, as described
      above, to ensure the X3D player can display it. It is often best
      to save and provide both formats so that the original
      highest-quality image remains available. Example:
      | <ImageTexture DEF='grid' url='"OahuGrid.png
      <https://savage.nps.edu/Savage/Locations/Hawaii/OahuGrid.png>"
      "https://savage.nps.edu/Savage/Locations/Hawaii/OahuGrid.png"
      "OahuGrid.rgba
      <https://savage.nps.edu/Savage/Locations/Hawaii/OahuGrid.rgba>"
      "https://savage.nps.edu/Savage/Locations/Hawaii/OahuGrid.rgba"'/> |
    * Use high-resolution quality (e.g. 300 dpi or better) since
      textured imagery is often viewed at close ranges. Try to keep
      image file size under 200-300 KB, if possible. Consider using both
      low-resolution and high-resolution versions as appropriate for
      level of detail (LOD) and Web delivery.
    * An image file can be embedded within an X3D scene by converting it
      into a PixelTexture
      <http://www.web3d.org/x3d/specifications/ISO-IEC-19775-IS-X3DAbstractSpecification/Part01/components/texturing.html#PixelTexture>
      node. These will take up more size (often by a factor of 10), but
      nevertheless do compress well and do not require a separate file
      fetch over the network. A PixelTexture image import
      <https://savage.nps.edu/X3D-Edit/images/PixelTextureImportImage.png>
      feature is provided by X3D-Edit <https://savage.nps.edu/X3D-Edit>.
      For an example conversion program, see PixelTextureGenerator.java
      <https://savage.nps.edu/Savage/Tools/Authoring/PixelTextureGenerator.java>
      which was used to create PixelTextureNavyJackDontTreadOnMe.x3d
      <https://savage.nps.edu/Savage/Tools/Authoring/index.html#PixelTextureNavyJackDontTreadOnMe>
      in the Savage/Tools/Authoring
      <https://savage.nps.edu/Savage/Tools/Authoring> collection.
    * Use the W3C Image Info Service
      <http://cgi.w3.org/cgi-bin/imageinfo> to check the properties of
      your online image.


all the best, Don
-- 
Don Brutzman  Naval Postgraduate School, Code USW/Br      brutzman at nps.edu
Watkins 270   MOVES Institute, Monterey CA 93943-5000 USA  +1.831.656.2149
X3D, virtual worlds, underwater robots     http://faculty.nps.edu/brutzman





More information about the X3D-Public mailing list