Rethink Scholarship at Langara 2010 Call for Entries from Rory O’Sullivan and Simon Bruyn on Vimeo.

A while back, I was trying to figure out if twitter was cool/useful/fun. So I signed up to experience all the hype myself. After a few months of tweeting, and reading tweets, I thought is had some merit and it would be cool if we could have an inter-office twitter. I tried to think of a way to do that, in the vein of “old is new again” I thought lets take twitter back to its roots, paper, Bam! Analog twitter was born. It was a paper on a clipboard with a pen. And people came by the water cooler and write whatever they wanted. Pretty sweet, until the pen was lost…enter the fail whale, just like real twitter. Please take a look at out analog twitter log, and enjoy. #Thankyou

Grid

1280×960 1280×1024 1600×1200 1680×1050
1920×1200 iPhone Black Berry Storm

Loud

1280×960 1280×1024 1600×1200
1680×1050 1920×1200 iPhone Black Berry Storm

Strings

1280×960 1280×1024  1600×1200
1680×1050 1920×1200 iPhone Black Berry Storm

We have made a few Personas to give some PINT love to your Firefox.

Check them out here.

Install Personas and enjoy.

From the makers of the beloved Helvetica documentary, comes Gary Hustwit’s next endeavor, Objectified. This new documentary explores objects that people come in contact with everyday, and the designers who design them. It features designers such as:

Chris Bangle (BMW Group, Munich), Jonathan Ive (Apple, California), Jane Fulton Suri (IDEO) among others. Each giving their thoughts on product design, inspiration and process.

“Objectified is a documentary about industrial design; it’s about the manufactured objects we surround ourselves with, and the people who make them. On an average day, each of us uses hundreds of objects. (Don’t believe it? Start counting: alarm clock, light switch, faucet, shampoo bottle, toothbrush, razor…) Who makes all these things, and why do they look and feel the way they do? All of these objects are “designed,” but how can good design make them, and our lives, better?” – Gary Hustwit

The trailer is up now to enjoy.

Watch the Video Here!
Unicycle Fun!

Not to long ago Thomas and I were chatting toward the end of the day, this included the normal rantings about the web, Lost, Macintosh, social media, viral videos and the like. We eventually got to a recent topic in the art community surrounding Shepard Fairey and fair use. He created an illustration of Barak Obama, and the Associated Press sued him, because Fairey used a photo from the AP as the basis of the portrait.

Now discussing this issue Thomas started to elaborate on his endeavors into the “nerdkore” art style. This movement is focused on using tech and computer influences in the art itself. This can range from an oil painting of Mario or a mixed media computer keyboard that has been smashed to bits. Many of Thomas’ efforts seemed to beg a similar fair use question Fairey had encountered since often ideas were sampled in the new piece.

One thought lead to another, homage, new administration, annoying computers, some sketching and fooling in Photoshop around – suddenly it’s art collaboration time!

Paragraph IV: A New Hope

Because the “HOPE” poster was on the mind of everyone and Thomas had just had yet another as he calls them “Vista Moments” time to bust another nerdkore piece this time Fairey style.

Like Fairey’s OBEY campaign, we figure REBOOT is what we Windows users dutiful do. We are subservient to the system, unable to change as our friendly sweater clad overlord makes a few more bucks.

Rebooting is command of what we must do, but packaged a bit better as you see it is the Aloe Vera of the computer world. Rub a little on, all better now.

User: “My system is doing X” (where X is something not appropriate)

IT/Support/Computer Person: Did you try a reboot?

Nothing wrong with that, it is life. You just need a little computer Aloe. Maybe they have one for other arenas, call the auto mechanic.

User: “My car won’t work, it’s doing X”

Mechanic: “Did you try to turn it off and on?”

or

Mechanic: “Did you take the gas in and out?”

or

Mechanic: “Did you remove the engine and put it back in?”

The equivalent of the “reboot” advice really doesn’t work offline but for some reason it does online.

We put up with a lot – 10 minute start-ups, grey screen, swirling circle, 5 minutes gone yet again! Blue screen of death! We must obey, we dutifully reboot,

Thomas, and now Joe, just had another Vista moment. We laugh a bit. We can’t stick it to the “man” but now we do have a nice satirical picture of Bill looking friendly and smiling in his sweater. He comforts us with a helpful hint (or is it an order?): REBOOT.

Enjoy it makes a great desktop.

1280×1024
1600×1200
1680×1050
1920×1200

]]> http://blog.pint.com/2009/03/12/bill-gates-says-%e2%80%9creboot%e2%80%9d/feed/ 0 http://blog.pint.com/2009/03/05/pint-iphone-site-is-launched/ http://blog.pint.com/2009/03/05/pint-iphone-site-is-launched/#comments Thu, 05 Mar 2009 21:47:48 +0000 Dylan Butler http://blog.pint.com/?p=325 After weeks of development, PINT is proud to announce the launch of our company web site custom made for the iPhone! You may be asking yourself, “aren’t all PINT sites iPhone compatible?” The answer is absolutely! The difference here is that we’ve developed a site custom-tailored to the iPhone that offers advanced functionality and usability beyond what a regular site can provide.

A brief overview of some of the key features:

• Easy-to-read interface eliminates the need to pan and zoom.
• Well-designed sliding menu allows visitors to get the information they need faster.
• Scrollable galleries have a very natural, Apple-esque feel to them. Visitors think they are using an iPhone app!
• Google Maps integration
• Improved form validation, enhanced specifically for the iPhone.
• Fading and rotating graphics make smarter use of precious screen space.

See it for yourself by visiting www.pint.com from your iPhone browser, or see the screenshots.

See more screenshots.

If you want to read more about the technical aspect of the development, please see this post.

Arial is a font that is familiar to anyone who uses Microsoft products, whether on a PC or a Mac. It has spread like a virus through the typographic world and shows the pervasiveness of Microsoft’s influence in the world.

Throughout the latter half of the twentieth century, one of the most popular typefaces in the western world was Helvetica. An icon of the Swiss school of typography, Helvetica swept through the design world and became synonymous with modern, progressive, cosmopolitan attitudes.

By the late eighties, the desktop publishing phenomenon was in full swing and Helvetica Postscript font was owned by Adobe. Around the same time, PostScript “clones” were being developed to compete with Adobe. These PostScript “work-alikes” were usually bundled with “look-alike” fonts, since the originals were owned by Adobe’s business partners. One PostScript clone, featured a Helvetica substitute developed by Monotype called Arial.

When Microsoft made TrueType the standard font format for Windows 3.1, they opted to go with Arial rather than Helvetica, probably because it was cheaper and they knew most people wouldn’t know (or even care about) the difference. Of course, Windows was a big hit. Thus, Arial is now everywhere, a side effect of Windows’ success.

The situation today is that Arial has displaced Helvetica as the standard font in practically everything done by nonprofessionals in print, on television, and on the Web. Arial gets chosen because it’s cheap, not because it’s a great typeface.

“Helvetica? That’s that font that looks kinda like Arial, right?”

Designing for mobile aside, I will discuss the lessons learned from developing a minified version of a corporate web site for the iPhone. We wanted to include as many features as possible, to showcase the iPhone’s wide range of features available to Safari. What we discovered, however, is that it doesn’t offer several basic things that would be valuable to a corporate entity such as an ‘Add to Contacts’ option (perhaps available via hcard or vcard microformat?), ‘Download to calendar’ option (We can’t get some iCal love?), and easily findable documentation – hint: make sure you register at the Apple site. Below you will find some of the things that made developing a miniature version of our company site for the iPhone a challenge.

1. Animation – Leave it up to the browser

Webkit Transitions / Webkit Animation
When looking to do animation on the iPhone, CSS webkit transitions are the smoothest, if you can get them to work. There are many quirks in the implementation that make this method more difficult than expected, and there is a lack of documentation. We had trouble animating the height and opacity attribute, so in the interest of time, we moved on to something more familiar. We also were unsure how to simulate ‘before’ and ‘after’ handlers within the animation timeline, so we left those to JavaScript for now.

YUI Animation
We used YUI as our JavaScript library and for our animations. YUI was the best fit as a JavaScript library for several reasons:

1. It is the library PINT has chosen for regular web site projects, so our developers are all familiar with it.
2. When served by Yahoo!, the minified files are under 25KB and on a CDN, so they load quickly and get cached on the iPhone (See screenshots below). Souder’s rules suggest bundling objects for improved load time, but in this case we’ll take the cache benefit over a few less HTTP requests.
   

   Files under 25KB get cached

   When each file is served by YUI, the files are cached and loaded quite fast because on a CDN.

   

   Files over 25KB do not get cached

   When files are consolidated, filesize may become too large.

   

3. We were able to use existing in-house widgets to quickly create effects.

IUI Library
IUI Library is a well written library by Joe Hewitt that has built-in support for most of the UI effects one would want to do with a web app on the iPhone. Although we used some of Joe’s code in our own implementation, we still probably could have saved time and smoothness by starting out with IUI rather than mixing and matching YUI as we did.

2. Gestures / Touch Events – Take Advantage

Apple has given the iPhone Safari some new events to handle touches and gestures.

We used the touch events and their clientY values to determine if you slid your finger from the left to the right or vice versa. By doing some digging around, we found Matthew Congrove’s flick code. With a little work, we were able to get that talking with Joe Hewitt’s animation code, which allowed our menus to use the same slide code as our galleries. In the next version of our site, we’ll convert all javascript animations to webkit transitions and/or animations.

One problem we had with Matthew’s code is that up/down scrolling functionality is lost with his small example there, but it can be easily added back in with some clientX before and after comparisons.

3. Orientation – Let CSS do the work, not JavaScript

The iPhone supports two orientation modes: portrait and landscape. Some authors have recommended devising show/hide functionality to hide entire sections from one orientation or the other. What we noticed in our designs, however, is that our pages look pretty similar in both modes with the exception of images, which often become wider when in landscape mode. We decided to make the layout a flexible width of 100% with CSS, that way the page content looks and feels like it should at any orientation. To hide anything that shouldn’t be visible for that current orientation, we introduced an orient attribute to the body tag, updated that value when the ‘onorientationchange’ event was fired, and used a CSS selector to hide the content.

One of the things we noticed when switching across orientations was that common left/right slider mechanisms had adverse effects on portrait mode when coming from landscape mode. Some more prodding is needed here, but just be sure to check any pages that use relative or absolute positioning for slide effects in both orientations (if you are supporting both).

All troubles aside, it was a pleasure developing solely for Safari on the iPhone and I wish every project could be as creatively groundbreaking as this one. And boy was it good to drop IE6 support for once.

In case you don’t have an iPhone, here is a slideshow of some of the pages from the site:

Ultimate Lesson: iPhone Safari is Safari, but web site development for iPhone is different. Don’t do as normal web developers do.