Apple.com has "_2x.jpg" high resolutionary images for the new iPad

The new iPad's resolutionary Retina display looks cool, but, on the other hand, it terrifies designers in the Web industry.  The new iPad is the first HiDPI device which works well for browsing PC websites. All images on the Web must be republished to enhance its experience on the new iPad and other upcoming HiDPI devices.

Apple's website itself is also ongoing to support HiDPI displays. Many image files on the website have a couple resolutions of normal one and doubled one which has "_2x" suffix. Here is a sample:


Traditional resolution version: 1454 x 605 pixel
http://images.apple.com/home/images/ipad_hero.jpg

High resolution version:  2908 x 1210 pixel (doubled!)
http://images.apple.com/home/images/ipad_hero_2x.jpg

Some images on the website still not have "_2x" version at this time, however. Any image files which has "_2x" version are automatically and progressively replaced by image_replacer.js according to the current display resolution setting. 

TRY IT NOW ON YOUR MAC

You could try the future with HiDPI on your current Mac by enabling it with Quartz Debug.app shipped with Graphics Tools for Xcode. Apple.com website would show "_2x" images when HiDPI is enabled on your Mac.

AUTO DETECTION

Check window.devicePixelRatio property to detect current display resolution by JavaScript.

Moving to the Bay Area

Hello 2012,

For these 5 years, I have been working at the Media Technology Labs (MTL) which is a R&D department of Recruit Co., Ltd., one of the most largest information media publishing companies in Japan. The company is spreading its business field to the global market. At January of 2012, I'll soon fly to the Bay Area of the center of universe to launch our new R&D branch focusing the cutting-edge technologies of the Internet.


"Wisdom of Earthquakes" Released at TechCrunch Disrupt Hackathon SF 2011

I'm attending the TechCrunch Disrupt SF 2011 held in San Francisco. Prior to the conference, I've hacked here at the huge hackathon filled with more than 700 hackers. It's a really exciting experience. I started hacking the "Wisdom of Earthquakes" web application and released it at the hackathon.

photo

The hackathon started at Saturday noon and ended at the Sunday noon. Each team of hackers must finish their hack in 24 hours.

photo

I've also posted articles about the event and food for hackers on my Japanese blogs in detail. TechCrunch's official report is here.


Wisdom of Earthquakes

After the lunch, the time has came for me to give a talk about my hack on the stage.

photo

I've hacked "Wisdom of Earthquakes" which is a web application with a calendar and a map to tell the wisdom we can learn from earthquakes.

This calendar shows 500+ memorial days of earthquakes hit in the history of the globe. The oldest one listed is the 62 Pompeii earthquake in Italy. We could see almost every day on the calendar has had one or more earthquakes. The wisdom helps us do something to survive at the next coming disaster.


The app is shipped as an open source at:
http://code.google.com/p/memorial-calendars/wiki/tcdisrupt

iPad 2 JavaScript Benchmark Results 37% Faster Than iPad 1

SunSpider JavaScript Benchmark marks 37% faster score on iPad 2 / iOS 4.3.1 / Mobile Safari 5.0 compared to iPad 1st gen.



Also note that iPad 1 could get significant peformance improvement by updating iOS from 4.2.1 to 4.3.1. This means Mobile Safari 5.0's "Nitro" Engine enabled on iOS 4.3 runs JavaScript quite fast.

Benchmark results captured are below:

iPad 2 - 4.3.1 and 4.3


iPad 1 - 4.3.1 and 4.2.1


PS.
My Mac results 344ms on Chrome and 360ms on Safari.
iPads are still nothing compared to Mac. :-<

* Japanese version of this post is here.

KDrawSprite: Get GPU power without cacheAsBitmapMatrix on AIR for iOS

KDrawSprite is an ActionScript library for mobile AIR applications using Packager for iPhone, AIR for iOS and AIR for Android to get more power of GPU. My iPhone app Korean Alphabet 1.2.2 is using this to get more than 30 fps on older devices, ex. iPod Touch 1st gen. A4 chip powered latest devices, such as iPad and iPhone 4, will performs 100 fps over with KDrawSprite.

Source on github:
https://github.com/kawanet/as3kawalib/raw/master/src/net/kawa/display/KDrawSprite.as
Document:
http://www.kawa.net/works/as/as3kawalib/docs/net/kawa/display/KDrawSprite.html


KDrawSprite draws your vector image onto a bitmap image. You don't need to manipulate cacheAsBitmapMatrix and cacheAsBitmap properties. These are powerful, however, sometimes make our app crashed erratically. You need take more care for iPad which has larger screen but has less memory.

How To Use This

Simply call KDrawSprite.getSprite() instead of setting cacheAsBitmapMatrix and cacheAsBitmap properties.
var sprite:Sprite = new Sprite();
sprite.graphics.beginFill(0x336699);
sprite.graphics.drawCircle(50, 50, 50);

// sprite.cacheAsBitmapMatrix = new Matrix(); // BEFORE
// sprite.cacheAsBitmap = true;


sprite = KDrawSprite.getSprite(sprite);       // AFTER

addChild(sprite);
sprite.x = 100;
sprite.y = 100;
sprite.scaleX = 0.5;
sprite.height = 50;
sprite.rotation = 1;
Bitmap operations such as moving, scaling and rotation will be GPU enabled.
KDrawSprite will also free memory of image rendered when it comes out of the Stage.

You need call getSprite() or draw() method whenever you make changes on the vector source image. This also means any other needless re-rendering will not be invoked. Learn more on document.

Super Sampling Anti-Aliasing (2x SSAA)

KDrawSprite supports 2x SSAA, super sampling anti-aliasing, in addition to NoAA per default.

Note

To get better performance and rendering quality, you MUST set stage.quality as StageQuality.LOW. Also use 2x SSAA when needed.
stage.quality = StageQuality.LOW; // must

* Japanese version of this post is here.

YAPC::Asia Tokyo 2010 - Japan's Perl Week

Autumn is the best season for Perl hackers to come to Japan as we have the YAPC::Asia in Tokyo. This year, at September 15-16, I attended the great conference held at the Tokyo Institute of Technology Univ.

photo

  Thursday, September 14 - Pre-Conference Meetup 


One day before the conference, we had the PerlCasual#4 developer meetup event organized by @yusukebe. The event was born as the antithesis of Shibuya.pm's technical talk events which were filled by too deep talks, such like x86, XS, binary etc., by super-guru hackers. Casual developers need another place.

At the event, I gave at a lightening talk "Reporting OSDC.TW - Shibuya.pm in Taipei." This April, we went the OSDC.TW 2010 conference in Taiwan. Shibuya.pm people, including me, gave talks there.


The first half of my talk reports the event and the reason we went there.
And the second is about my 3D JavaScript talks.
Try my slide here and push [3] key on your keyboard to view slides in 3D mode.

photophoto

Photo (left): @obra's T-shirt shows he is a "Strange Alien."
(right): the Acmencyclopedia 2010 at the after-party of day #0.

  Friday, September 15 - Conference Day #1


At the first day of the conference, I and my colleague @iandeth gave a talk. His slides are here. My part is about the Mashup Awards 6 (MA6), Japan's largest web application development contest. My slides are here.

photo

The day #1's after-party was the official party held in the venue.
@clkao's T-shirt shows "Taiwanese." It's easy for us to see his nationality.

photophoto

My ex-colleague @tsuyoshikawa is a Ruby guy but now working at a large PHP company. The company ordered him to give a talk at the Perl conference. It seems he is drunken from the stresses. :)

  Saturday, September 16 - Conference Day #2


Day #2 was Saturday and sunny. Some speakers went down to a BoF looked like a picnic to have a beer under the sun.

photo

On the other hand, as the closing keynote, @miyagawa gave us the great talk filled with many of suggestions and encouragements for developers. The talk was this year's best talk in my opinion.

photo

He showed us the "Secret of success" that he found during his work for Plack and his other projects.
Secret of success

* Good artists borrow, Great artists steal
* Better late than too early
* JFDI (Just f* do it)
* STFUAWSC (Shut the f* up and write some code)
* TIMTOWTDI (There is more than one way to do it.)
  BSCINABTE (But sometimes consistency is not a bad thing either)
* KISS (Keep it simple, stupid)
* glue language
* Naming

Thank you so much, the YAPC organizers and volunteers.

  Sunday, September 17 - Hackathon

Sunday, we had the post-conference-hackathon at @hidek's.

photophoto

photophoto

After the hackathon, we went to a Chankonabe restaurant near @hidek's as the 4th after-patry. We had too many after-parties this week with a lot of fun!


  Related Posts

Encode::JP::Emoji 0.60 Supports Unicode 6.0 Emoji!

October 11, Unicode Consortium released Unicode Version 6.0 including Emoji code points and the mapping table. Then, today, I've just shipped Encode::JP::Emoji version 0.60 which supports encoding conversion for variant emojis between Unicode 6.0 and Japanese mobile phone carriers as a fast pure Perl module.
use Encode;
use Encode::JP::Emoji;

my $sun = "\xF8\x9F";
Encode::from_to($sun, 'x-sjis-e4u-docomo', 'x-utf8-e4u-unicode');
# U+2600

my $watch = encode_utf8 "\x{231A}";
Encode::from_to($watch, 'x-utf8-e4u-unicode', 'x-utf8-e4u-kddiapp');
# U+E57A
The code above means:
$sun: from DoCoMo's F8F9 (Shift_JIS) to Unicode 6.0's U+2600.
$watch: from Unicode 6.0's U+231A to KDDI's U+E57A (UTF-8). 

Encode::JP::Emoji's Encodings


Encode::JP::Emoji modules provides numbers of encodings.
Check the figures below to see which encoding to fit for your use. 

Group #1 uses each carrier's private code points as Perl's internal string which has UTF-8 flag on.


Group #2 uses Googles's private code points internaly. This means Google's encoding could be the interchange encoding for others.


Group #3 also uses Google's internal.
See Unicode 6.0's emojis are supported here.


Tha last group #4 rejects any emojis above.
Use this group with FB_EMOJI_TEXT fallback function.

For more detail, see POD documents on CPAN.

* Original post of this is posted in Japanese.

img2html - bookmarklet for blog posting with flickr, picasa, etc.

The img2html bookmarklet below helps you to get a html source code with a <img> element which refers photo sharing service, ex. Yahoo's Flickr, Google's Picasa Web Album, etc.

img2html

You can also try just to click the link above for testing on the site.
It generates HTML source code like below:
<a href="Page URL" target="_blank" title="Page Title"><img src="Image URL" width="Image Width" height="Image Height" border="0" alt="Image ALT" /></a>
The largest image on page is picked up by the bookmarklet.
This works on flickr.



Also works on Picasa Web Album and any other websites.



Related Posts

Cantonese Alphabet - iPhone app for traveling in Hong Kong

The Canotonese Alphabet mobile application is now available on iTunes App Store. This helps you to read Cantonese, spoken in Southern China including Hong Kong. It's just US$1.99. But this now!


To enter Cantonese phrases, use iOS's built-in Traditional Chinese hand-writing keyboard. The app also have online translation feature. This means you can translate English to Cantonese to read them in Cantonese.

The Last Piece


This was the latest member of the series of my Asian Alphabet applications.


Complete all five apps for Korean (Hangul), Chinese (Simplified and Traditional), Japanese and Cantonese!

Related Posts

Japanese Alphabet - iPhone App for Kanji and Kana

The Japanese Alphabet mobile application for iPhone / iPod Touch is now on sale at App Store. This helps you to read Japanese phrases when you come to Japan, study Japanese, order something at Japanese restaurants, etc. It's just USD $1.99. Buy this now!


This allows you to enter Japanese in serveral ways. First, Hiaragana software keyboard. Originally iOS doesn't have the feature but the app has.


Second, Katakana software keyboard. Again, you can easily select a Kana character you want to enter by clicking it from the list.


You can also use iOS's built-in Traditional Chinese character hand-writing keyboard. Note that most of Kanjis used in Japan are same to Kanjis used in Taiwan. Differences are intelligently corrected by the app.


At last, you can call Google Translate from the app. Entering English phrases, you will get Japanese phrases translated and see how to read them.

Related Posts