I've been working on a tiny bit of JavaScript and CSS that anyone can drop into their pages to turn simple standards-based HTML into something that looks and acts like a native iPhone app. The goal is to allow people to write apps for the iPhone without having to write any JavaScript, and to promote better usability, for example, by supporting the back/forward buttons, hiding the location bar, and sliding animations between pages.
I could go on and on, but you'll probably just want to check out the demo on your iPhone, and then look at the source to see how simple the HTML is:
> I've been working on a tiny bit of JavaScript and CSS that anyone can > drop into their pages to turn simple standards-based HTML into > something that looks and acts like a native iPhone app. The goal is > to allow people to write apps for the iPhone without having to write > any JavaScript, and to promote better usability, for example, by > supporting the back/forward buttons, hiding the location bar, and > sliding animations between pages.
> I could go on and on, but you'll probably just want to check out the > demo on your iPhone, and then look at the source to see how simple the > HTML is:
Joe Hewitt wrote: > I've been working on a tiny bit of JavaScript and CSS that anyone can > drop into their pages to turn simple standards-based HTML into > something that looks and acts like a native iPhone app. The goal is > to allow people to write apps for the iPhone without having to write > any JavaScript, and to promote better usability, for example, by > supporting the back/forward buttons, hiding the location bar, and > sliding animations between pages.
> I could go on and on, but you'll probably just want to check out the > demo on your iPhone, and then look at the source to see how simple the > HTML is:
> I've been working on a tiny bit of JavaScript and CSS that anyone can > drop into their pages to turn simple standards-based HTML into > something that looks and acts like a native iPhone app. The goal is > to allow people to write apps for the iPhone without having to write > any JavaScript, and to promote better usability, for example, by > supporting the back/forward buttons, hiding the location bar, and > sliding animations between pages.
> I could go on and on, but you'll probably just want to check out the > demo on your iPhone, and then look at the source to see how simple the > HTML is:
Joe, this is pretty good! There are a couple *very subtle things* that the phone ui does you might want to add, but here is one off the top of my head:
The text in title bars actually slides into place when you so a transition. Its such a subtle effect that you might not even conciously notice it...but I could tell something was 'funny' about your nav so I went back and had a look and noticed what was missing.
Just another testiment I guess to apple's insane attention to detail heheh.
On Jul 6, 2007, at 9:22 AM, Joe Hewitt <joehew...@gmail.com> wrote:
> I've been working on a tiny bit of JavaScript and CSS that anyone can > drop into their pages to turn simple standards-based HTML into > something that looks and acts like a native iPhone app. The goal is > to allow people to write apps for the iPhone without having to write > any JavaScript, and to promote better usability, for example, by > supporting the back/forward buttons, hiding the location bar, and > sliding animations between pages.
> I could go on and on, but you'll probably just want to check out the > demo on your iPhone, and then look at the source to see how simple the > HTML is:
In one word... WOW! This is a fantastic base for others to follow. Just wondering if there were any of the other icons like the red twisty and the delete button?
On Jul 6, 9:22 am, Joe Hewitt <joehew...@gmail.com> wrote:
> I've been working on a tiny bit of JavaScript and CSS that anyone can > drop into their pages to turn simple standards-based HTML into > something that looks and acts like a native iPhone app. The goal is > to allow people to write apps for the iPhone without having to write > any JavaScript, and to promote better usability, for example, by > supporting the back/forward buttons, hiding the location bar, and > sliding animations between pages.
> I could go on and on, but you'll probably just want to check out the > demo on your iPhone, and then look at the source to see how simple the > HTML is:
> In one word... WOW! This is a fantastic base for others to follow. > Just wondering if there were any of the other icons like the red > twisty and the delete button?
> On Jul 6, 9:22 am, Joe Hewitt <joehew...@gmail.com> wrote: >> I've been working on a tiny bit of JavaScript and CSS that anyone can >> drop into their pages to turn simple standards-based HTML into >> something that looks and acts like a native iPhone app. The goal is >> to allow people to write apps for the iPhone without having to write >> any JavaScript, and to promote better usability, for example, by >> supporting the back/forward buttons, hiding the location bar, and >> sliding animations between pages.
>> I could go on and on, but you'll probably just want to check out the >> demo on your iPhone, and then look at the source to see how simple >> the >> HTML is:
> If you wish to...reimplement(?) them, I have every single ui element > from the phone.
> On Jul 6, 2007, at 3:24 PM, scripto <carlleewil...@gmail.com> wrote:
> > In one word... WOW! This is a fantastic base for others to follow. > > Just wondering if there were any of the other icons like the red > > twisty and the delete button?
> > On Jul 6, 9:22 am, Joe Hewitt <joehew...@gmail.com> wrote: > >> I've been working on a tiny bit of JavaScript and CSS that anyone can > >> drop into their pages to turn simple standards-based HTML into > >> something that looks and acts like a native iPhone app. The goal is > >> to allow people to write apps for the iPhone without having to write > >> any JavaScript, and to promote better usability, for example, by > >> supporting the back/forward buttons, hiding the location bar, and > >> sliding animations between pages.
> >> I could go on and on, but you'll probably just want to check out the > >> demo on your iPhone, and then look at the source to see how simple > >> the > >> HTML is:
They were extracted from the iPhone restore disc image...which is a treasure trove of information on just how clever apple is...both in engineering and marketing :)
On Jul 6, 2007, at 3:36 PM, scripto <carlleewil...@gmail.com> wrote:
> And where would one find this great store of UI elements? :)
> On Jul 6, 3:34 pm, Kai Cherry <kai.che...@gmail.com> wrote: >> If you wish to...reimplement(?) them, I have every single ui element >> from the phone.
>> On Jul 6, 2007, at 3:24 PM, scripto <carlleewil...@gmail.com> wrote:
>>> In one word... WOW! This is a fantastic base for others to >>> follow. >>> Just wondering if there were any of the other icons like the red >>> twisty and the delete button?
>>> On Jul 6, 9:22 am, Joe Hewitt <joehew...@gmail.com> wrote: >>>> I've been working on a tiny bit of JavaScript and CSS that anyone >>>> can >>>> drop into their pages to turn simple standards-based HTML into >>>> something that looks and acts like a native iPhone app. The goal >>>> is >>>> to allow people to write apps for the iPhone without having to >>>> write >>>> any JavaScript, and to promote better usability, for example, by >>>> supporting the back/forward buttons, hiding the location bar, and >>>> sliding animations between pages.
>>>> I could go on and on, but you'll probably just want to check out >>>> the >>>> demo on your iPhone, and then look at the source to see how simple >>>> the >>>> HTML is:
The problem with adding subtle animations is that, well, Safari isn't very good at animation :) It barely manages to render the 5 frames to slide the incoming page from left to right without stuttering. If we were to also fade/slide in the new title and the "Albums" button, it would probably not look very smooth. Still, I'll give it a shot and see what happens :)
> Joe, this is pretty good! There are a couple *very subtle things* that > the phone ui does you might want to add, but here is one off the top > of my head:
> The text in title bars actually slides into place when you so a > transition. Its such a subtle effect that you might not even > conciously notice it...but I could tell something was 'funny' about > your nav so I went back and had a look and noticed what was missing.
> Just another testiment I guess to apple's insane attention to detail > heheh.
> On Jul 6, 2007, at 9:22 AM, Joe Hewitt <joehew...@gmail.com> wrote:
> > I've been working on a tiny bit of JavaScript and CSS that anyone can > > drop into their pages to turn simple standards-based HTML into > > something that looks and acts like a native iPhone app. The goal is > > to allow people to write apps for the iPhone without having to write > > any JavaScript, and to promote better usability, for example, by > > supporting the back/forward buttons, hiding the location bar, and > > sliding animations between pages.
> > I could go on and on, but you'll probably just want to check out the > > demo on your iPhone, and then look at the source to see how simple the > > HTML is:
I think it will work, joe. I was able to get a fairly smooth bidirectional animation going with bytefx. Now it took an hour to tweak... But that'd be part of the thill, yeah? ;)
On Jul 6, 2007, at 5:12 PM, Joe Hewitt <joehew...@gmail.com> wrote:
> The problem with adding subtle animations is that, well, Safari isn't > very good at animation :) It barely manages to render the 5 frames > to slide the incoming page from left to right without stuttering. If > we > were to also fade/slide in the new title and the "Albums" button, it > would probably not look very smooth. Still, I'll give it a shot and > see > what happens :)
You mean after all my insufferable tweaking in Photoshop last night I could have just gotten the real graphics right from Apple?? :)
If you've really got them, I'd love to see them. There are still plenty of UI elements left to skin, and some of the graphics I created are far from accurate.
> You mean after all my insufferable tweaking in Photoshop last night I > could have > just gotten the real graphics right from Apple?? :)
> If you've really got them, I'd love to see them. There are still > plenty of UI elements > left to skin, and some of the graphics I created are far from accurate.
> Yes - Kai - please do supply the actual iPhone GUI graphics to all of > us developers if you really have gotten your hands on them - PLEASE!!!
> thanks :-)
> On Jul 6, 5:29 pm, Joe Hewitt <joehew...@gmail.com> wrote:
> > You mean after all my insufferable tweaking in Photoshop last night I > > could have > > just gotten the real graphics right from Apple?? :)
> > If you've really got them, I'd love to see them. There are still > > plenty of UI elements > > left to skin, and some of the graphics I created are far from accurate.
Y'know, I hope I'm wrong about this but this UI scheme... wasn't this the so-called patent infringement that Creative successful won over Apple? If so, does this have any bearing on web app developers?
> Y'know, I hope I'm wrong about this but this UI scheme... wasn't this > the so-called patent infringement that Creative successful won over > Apple? If so, does this have any bearing on web app developers?
> Yes - Kai - please do supply the actual iPhone GUI graphics to all of > us developers if you really have gotten your hands on them - PLEASE!!!
> thanks :-)
> On Jul 6, 5:29 pm, Joe Hewitt <joehew...@gmail.com> wrote: >> You mean after all my insufferable tweaking in Photoshop last night I >> could have >> just gotten the real graphics right from Apple?? :)
>> If you've really got them, I'd love to see them. There are still >> plenty of UI elements >> left to skin, and some of the graphics I created are far from >> accurate.
> I sent them to a couple of people here on the list so I'm sure they > will avail themselves. Ah. I see the system is working. Share and > enjoy :)
> On Jul 6, 2007, at 6:01 PM, crash <dustincar...@gmail.com> wrote:
> > Yes - Kai - please do supply the actual iPhone GUI graphics to all of > > us developers if you really have gotten your hands on them - PLEASE!!!
> > thanks :-)
> > On Jul 6, 5:29 pm, Joe Hewitt <joehew...@gmail.com> wrote: > >> You mean after all my insufferable tweaking in Photoshop last night I > >> could have > >> just gotten the real graphics right from Apple?? :)
> >> If you've really got them, I'd love to see them. There are still > >> plenty of UI elements > >> left to skin, and some of the graphics I created are far from > >> accurate.
On Safari 3.02 for mac, if I use CMD+LeftArrow to go back, your back button doesn't change. When I get all the way back to the first page, the back button is still showing. The rest of the page is changing exactly as it should, but your graphic in the upper-left stays put. -=Randy
On 7/6/07 6:22 AM, "Joe Hewitt" <joehew...@gmail.com> wrote:
> I've been working on a tiny bit of JavaScript and CSS that anyone can > drop into their pages to turn simple standards-based HTML into > something that looks and acts like a native iPhone app. The goal is > to allow people to write apps for the iPhone without having to write > any JavaScript, and to promote better usability, for example, by > supporting the back/forward buttons, hiding the location bar, and > sliding animations between pages.
> I could go on and on, but you'll probably just want to check out the > demo on your iPhone, and then look at the source to see how simple the > HTML is:
|
