Category: mac-ios

verlet integration

Published: | Categories: computer-graphics, cs & it, mac-ios
Tags:

little fun with gaming physic, written using Three.js, the 3D library built ontop of HTML5 and WebGL. Physics engines like ODE or PhysX support a wide range of simulation: rigid body, soft body objects… While those engines are powerful, they are somewhat weak in scalability, e.g: to simulate the flag below, we need to create an array of hundreds of objects, which may not really feasible on small devices.

This demo tries its own physical calculation called Verlet integration: numerical method to apply Newton’s second law of motion to a system of point masses. Verlet integration, despite its complicated formal description, is simple enough to be calculated and executed in real time on the low end mobile devices.

The demo works best on Chrome but it should work on any browser that supports <canvas> (try dragging the flag to add some motion).

game terrain

Published: | Categories: computer-graphics, cs & it, mac-ios
Tags:


little technique to create terrains for use in game. Sometimes, we need to create game spaces with: mountain, plain, valley, river… the environment where our game scenes take place. It could be a labour – intensive task unless we can make use of the existing geographic data. Some games like Flight Simulator have the scenes modelled exactly after the real world.

First, we would need a topographic map, typically the height – contour map used in artillery. Nowadays, the SRTM and ASTER GDEM projects provide these data for free in digital format. They are satellite (radar) images of the earth surface with resolution upto 90m for SRTM and 30m for ASTER GDEM. I would recommend the ASTER GDEM for its higher resolution. Go to the site, follow its complicated registration process to download the data via NASA’s ftp server.

The downloaded data would be Zip packages with height info in GeoTIFF format. Next, we would use this MicroDem utility to convert it into PGM, an intermediate format that can be read by Photoshop (or GIMP). Then we save it as heightmap (PNG or TIFF format) which can be imported into most game editors. By now, the terrains are recreated exactly as they appear in our real geographical world. Just apply textures, lighting, water and other stuffs then to make it look good!

Images on the left: 1. topographic data as rendered by MicroDem, 2. heightmap (grayscale image) as viewed by Photoshop, 3. the terrain created and roughly decorated (a low – poly version), here is the Sơn Trà peninsula (or les vallées de mon coeur 😀), the shape, the silhuette that’s long been in my heart!

unity

Published: | Categories: computer-graphics, cs & it, linux, mac-ios



Screenshots of the new Unity desktop. There’s certainly a harsh non – exclusive competing between Unity and GNOME Shell. A proxy war between Ubuntu and Fedora Core, which is in turn a proxy war between Canonical and Red Hat.

Eventually, it’s user experiences that would decide which desktop is best (and best for what), and that’s still a long way to come. But technically, Unity is the first huge bold break from tradition, whose real goal deep inside is replacing completely the age – old heritage of X window system by an OpenGL – based one, a problem partially addressed in my previous post.

am trying Ubuntu’s new desktop introduced lately with Natty Narwhal (11.04). After heavy development phases, Unity has reached its alpha stage, a massive move replacing the GNOME desktop environment by a completely new one written from scratch. I’ve read too many negative reviews about Unity already, but personally I think this is a good move. Developed from Ubuntu’s Netbook Remix (which I didn’t like much, you don’t have to maximize windows like that all the time), switched from Clutter to Compiz 3D windows compositing system (my last experiment with Clutter also hinted potential performance problems), the new Unity shows a huge shift toward Mac’s style desktop. Though there’s still lots of bugs and missing features, a few things can be said about this new Unity.

First, people complains about the break from the norms, some hates Unity because it stops their accustomed habits. The GNOME community (with its long development history) can feel like being betrayed. But for all I knew after some years in graphics, UI design is the job of personality, it’s the task of a small group who decides what is “nice and beautiful”, and which is the way (for other users) to follow, it’s not the task of a committee (that is “People’s Committee” I mean 😬). As a developer, I’m often in the self – conflicting state of wondering what is “nice and beautiful”, modify over and over again some simple UI widgets. It’s no strange that UI always becomes a huge diversity (and problems) for community – driven projects. Key requirements for a UI system in my opinion are: simplicity, consistency and elegance.

For consistency and simplicity, Unity is a big step forward, reasons given that GNOME has become too complex and inconsistent (then how about the much more complex KDE?). Maximized windows have the caption and menu bars all incorporated into the system bar on top, a feature clearly borrowed from Mac, yet further varied and developed. A simple dock bar is positioned on the left, and system menu button doesn’t bring up menu but a searching panel with which you can launch programs, open files… with a few key strokes. I like this much cause it offers a form of GNOME – Do: it’s harder to launch rarely – used items (especially if you don’t remember the names) but it’s more convenient for frequently – used ones. After all, lexical memory is much faster than spatial memory, if one has been trained to that.

One more apparent physical factor is that the vertical screen space is more scarce compared to horizontal space, and 16:9 screens has become quite popular. To conserve useful screen space, UI must make constraints to the caption, menu bars, especially tool bars, there’s even recommendations on eliminating the status bar and minimizing scroll bar at Mark Shuttleworth’s (Canonical’s founder) blog. For scroll bar, that’s quite sure a mimic and modified version taken from iOS. Actually with my recent experiences with Mac and iOS, there’s still a lot of lessons to be learned from these two OSes on how to use space efficiently: remove heavy windows decorations and borders, use lighter UI fonts, smaller and more symbolic icons, design simpler widgets… and in cases even sacrifice some less – used UI features.

The trend of UI becoming simpler and more consistent is quite obvious. Efficient uses of space is the key, but spatial is not all for user experiences: keyboard and mnemonic are also important parts of the learning path (UI effects can be fancy, but over time, people get to love the simplest keystrokes that do the job). The third factor: elegance is even more a topic of debate, people can largely agree to what is simplicity and consistency, but what is aesthetics remains mysterious! Unity claims that it would directly compete Mac on UI designs and user experiences, but my opinion is that its aesthetic aspect is still far behind that of Mac, e.g: Compiz’s effects are numerous, but actually not very fine – tuned compared to the smaller set of animations Mac offers… And even Mac still doesn’t satisfy my eyes in quite many cases…

vectorial

Published: | Categories: computer-graphics, cs & it, mac-ios

The classical SVG example rendered using a thin OpenVG layer on top of OpenGL (or Quartz) on a Mac. This is also to say goodbye to the old Lunar year (year of the tiger) that is ending!

inished with my survey on vectorial graphics, in details, about rendering SVG using Quartz, OpenGL (ES) on Mac, iOS and some Android flatforms. I’d had the chances to systematize more my knowledge on vectorial: path, stroke, anti – aliasing, solid, gradient and pattern fill, etc… Todays, people’s all talking about 3D, OpenGL, DirectX, etc… While few mentions much about 2D stuffs, I’ve traced back some historical evolution paths, since I believe that it’s through history would we understand technologies.

In the beginning, there was… PostScript

It was John Warnock who kindled the idea, he joined Xerox in 1978 and an early version of PostScript (named InterPress) became the language to drive a laser printer. Laser printer was then a revolutionary device, which offers extraordinary graphics compared to the capability of dot or matrix printers. Warnock left and founded Adobe in 1982, the company that produced well – known graphics softwares including Illustrator, king of the vectorial editors.

Then there was DPS, PDF and Quartz

But it was Steve Job who realized the superiority of PostScript and urged John Warnock to popularize it. When Steve Jobs left Apple and started NeXT, he co – developed with Adobe DPS – Display PostScript, a derivative of PostScript – the language that drives the NeXT computer’s graphics system. When Steve has got back to Apple, DPS then evolved into what is now known as PDF, and Quartz is the C binding that bridges traditional Unix programmers to the Mac graphics world.

The X window system

The X’s designers also started with a PostScript RedBook in hand. But due to various reasons including the lack of in – depth consensus about vectorial, X maintains until now low level of PostScript support. The X server can only handle basic PostScript commands (it can’t even draw splines). X took a hybrid approach using both vectorial and raster – based solutions to the problem. Also the Unix root has an impact: X is the only true client/server windowing system to the current day.

Until now, the NeXT computer remains an idealistic symbol, pure vectorial remains a pursuit, perhaps for higher – standard devices, such as with this Backbone:

Backbone is an attempt (our attempt) at creating a Really Good Desktop. The metric we use for “Really Good” is our own. In short, to us, to carry on the NeXTSTEP® and OPENSTEP® spirit!

The Windows’ GDI

Born to be the youngest of all graphics systems, GDI learns nothing from it predecessors. Neither it is device and resolution independent (like Macs) nor a true client/server system (like X). GDI sticks to screen and the pixel unit with quite a lot implementation flaws. These flaws won’t become obvious until we come to serious editing, publishing and printing: text documents and graphics designs would never has the on – screen – display and printing qualities we would expect, though various 3rd party softwares would come to rescue somewhat the situations.

Then, things change with time

The 2D graphics systems on Mac, Windows, Unix… all has different origins, and all targets different real – world problem domains. All has hardware acceleration to various levels and qualities, and it’s hard to compare them in some cases. To the present day, no system is known to keep the original idealistic model that uses pure PostScript: X has been mixed from the beginning, Mac & iOS have switched to raster to some extent, GDI is essentially pixel – based. Then come the wind of change! It would be another story, another evolution path, but today, 3D hardwares has become quite popular with reasonable prices. It’s counter – intuitive to treat 2D as a separate part from 3D, and the trend is merging 2D to become a subset of 3D rendering. However, the process hasn’t been very easy, it would take some more time to reach maturity:

  • WPF (Windows Presentation Foundation): first came with Windows Vista, GDI now runs as part of DirectX 3D rendering environment. Vista was not a success indeed!

  • QuartzGL: Quartz2D runs on top of OpenGL since OS X 10.2 (Jaguar). However, QuartzGL is not enabled by default even in the current version (10.6 – Snow Leopard) since it’s still quite buggy.

  • GLX & AIGLX: both has some implementation problems and is competing to each other to become the official 3D extension for X.

Taken an arbitrary GDI’s API (such as MoveTo, LineTo…) we can see the parameters’ type is integer, which is in reality the pixel unit. The Quartz’s counterparts are always in float, a virtual unit so that the APIs can be device and resolution independent.

The so called “GDI printer” is actually a bitmap device, it lacks a PostScript interpreter and hence need to be attached to a computer to do the actual computing. Reason is obvious: cheapness, adding a PostScript interpreter would significantly raise the cost!

Win vs. Mac font rendering (and the way for Linux)

Published: | Categories: computer-graphics, cs & it, linux, mac-ios
Tags:

We could easily see the very poor font rendering quality of Windows right on Windows itself using Safari. Safari has different smoothing modes (image above) and another mode named “Windows’ standard” (image below)


Differences between font rendering on Ubuntu (above) and Windows (below).

everal years ago, on earlier versions of Fedora, Ubuntu… font rendering is just a crap! Many people would find Windows better at text rasterization, and both are far inferior compared to Mac. In latest versions of Linux desktop, things are much improved, while Windows (Vista, Win7) is still much lagging behind, Linux made bold advances from lessons learned from both Win and Mac!

Novice users on Windows would find its text sharper, clearer and easier to read, while Mac’s one is a bit blurry! That is because Mac and Win have different origins and targets! Apple has deep legacy in graphics designs and desktop publishing, its algorithms try to preserve the nature of typefaces as much as possible, which implement true sub-pixel rendering aiming at high-resolution output devices. Meanwhile, Win sticks to pixel unit and aims at low-resolution device (like computer screen which usually less than 100 dpi in resolution).

The consequence is that while Win’s text look sharper and clearer on screen, it would turn into a whole crap when come to printing, where Mac’s publishing products are closer to its screen look! Even worse, Windows text rendering solutions are just suitable for simple typefaces, when complex, high-quality font is needed, the output is usually very poor due to various wrong implementations in hinting, anti-aliasing, kerning algorithms. This paper (2007) addresses in details many Microsoft’s implementation problems, and suggest the correct ways for text rasterization, resulting in a now-much-better Linux desktop!

(If you’re using a Mac or a Linux desktop, you would see this blog text in VN URW Gothic L, a aesthetically fine font. Windows readers would only see the text in Arial, as I have to turn off font embedding for Windows due to its very poor presentation.)

Update, Feb, 20th, 2011

The font used now is Tex Gyre Adventor, an enhanced font based on URW Gothic L, you can see the hinting is quite better, especially for Vietnamese text. The trade – off is that file size is much larger, almost triple the URW Gothic L’s size.