Verizon The Official Blackberry Storm 9350 Custom Home Page & Browser Thread

mkleiman

New member
HoFo Member
Joined
Dec 19, 2006
Messages
604
Location
Chicago
Carrier(s)
Verizon
Device(s)
Storm
I'd like to devote this thread to the discussion of developing custom home pages, web sites and web applications specifically designed for the Storm's browser (version 4.7.0 and higher).

-----------------------------------------------------------------------
Resources:

Browser Documentation:

Browser Documentation v4.6

Note: Although documentation has not been released for the v4.7 browser, based on my experiments with the 9350 Simulator, the v4.6 documentation and reference guides are generally quite accurate.

RIM Development Resources:

BlackBerry Browser Development Home Page

Blackberry Support Forum - Browser Development

-----------------------------------------------------------------------

Note to Mods: Since this topic isn't about the release of the Storm or the device per se, I think this deserves its own "official" thread here. Also, I note that my Custom Homepage thread on the Voyager subforum currently has 414 posts and 39,260 views, so hopefully this thread will similarly develop into a useful ongoing resource for Storm owners.
 
Storm Home Page [beta]

In anticipation of the Storm's release, I've been developing a custom home page to display my favorite links as well as show off the capabilities of the phone and the full html browser. Since I'm not a Verizon or RIM insider, I have been using the Blackberry 9350 Simulator to develop and test my coding.

Until I actually have a Storm in hand, I can't be 100% certain that my code will work as intended, so I'm not releasing anything publicly yet. However, to give people an idea of my current design template and to start the discussion, I'll post some screenshots of my current beta version. The following is the Main (or "home") page as displayed in both portrait and landscape view:

homemainportraitgg7.jpg
homemainlandscapewn2.jpg


Yes, the design does change automatically when you tilt the device, switching from the one-column layout in portrait mode to the two-column view in landscape mode. The font size also changes. In fact, I've written a script that will allow changing any page elements based on the device orientation: change colors, switch backgrounds, swap images, show/hide elements, trigger animations, etc. I'll explain more about that in the future once I get to do some on-device testing to confirm that my code works on the phone itself. In the meanwhile, here's a couple more screenshots showing the News folder (in portrait mode) and the Sports folder (in landscape mode):

homenewsportraitva3.jpg
homesportslandscapeek5.jpg


My template allows an infinite number of folders and subfolders to organize the links. I've got about 50 links at present, but its trivially easy to edit the template to add or change things. Notice the date and time in the upper-left (in the phone status bar). It updates in real-time (normally the browser would display the title of the webpage up there, but I felt that was a horrible waste of space). Here's the final bit of shiny for today ... click the weather icon in the upper-right corner, and you get a pop-down display of your current and forecasted weather conditions:

homemainportraitweatherkw1.jpg


As a reminder, all these screenshots are from the Simulator. I don't have the phone, so don't post or PM me asking how I got my hands on the Storm early.

I know there are elements of the page/layout/graphics that could/should be improved. Its only a beta version, and I'll work on it some more when I get the phone. I will release the template code once I've tested it, and at that time I will post instructions on how to use this as your home page and/or to customize it.

In the meanwhile, if you have any questions, comments or suggestions, please ask away. Hopefully others will also be interested in designing Storm-specific templates and will be willing to share their efforts.
 
I'm not gonna lie, mkleiman, that look SWEET!

Remember me if you get it going...that's awesome.
 
Fantastic work. I'm eager to take a peak at the finished code!
 
WOW! Someone who's actually being PRODUCTIVE while waiting!

Sweet!!!
 
"We are not worthy!" "We are not worthy!" :clapping: :2thumbs: :2thumbs:
 
That is absolutely beautiful, awesome job, especially w/ just the simulator... :2thumbs:
 
This looks great! I've been following all the work in the Voyager sub-forum since you first posted, and I'm VERY looking forward to this on the Storm. Thanks for your work!
 
what a great design

After more than 10 years with +7 Palm pda(s), I had a bit of meltdown today thinking of the loss for all the appplications/data/interfaces I have used daily for so many, many years and thinking to myself why now am I going to BB now that I'm retired. THEN I saw your new SOA clean interface and loved the design. It was clearly at that point I had a complete turned around ... so Storm ... let's make it so and MKLEIMAN add me to your list to buy your design!
 
Dude, creative and awesome! Great work...can't wait to see the finished product!!
 
Ajax support according to the DOCS... I will most certainly be creating a template as well.
 
Thanks everyone for the early words of encouragement! :2thumbs:

I've reworked the template into a full ajax implementation, with each page of links in a separate xml file. It is now incredibly easy to add or change links, to add new pages, and create new folders and subfolders. The only thing you'll need is Notepad! The simulator handles ajax and my other scripts just fine, so hopefully the phone will follow suit.

1975auburn said:
MKLEIMAN add me to your list to buy your design!

Hehe, you can put your wallet away. As folks from the Voyager forum know, I do this merely for the fun of it. Once I get the final design up on the internet, anyone will be able to use it as their home page. I also make my templates available for download, so that you can edit the links and host your own version if you prefer. Stay tuned....
 
mkleiman said:
Thanks everyone for the early words of encouragement! :2thumbs:

I've reworked the template into a full ajax implementation, with each page of links in a separate xml file. It is now incredibly easy to add or change links, to add new pages, and create new folders and subfolders. The only thing you'll need is Notepad! The simulator handles ajax and my other scripts just fine, so hopefully the phone will follow suit.



Hehe, you can put your wallet away. As folks from the Voyager forum know, I do this merely for the fun of it. Once I get the final design up on the internet, anyone will be able to use it as their home page. I also make my templates available for download, so that you can edit the links and host your own version if you prefer. Stay tuned....

WOW! I must say that looks great! Nice work!
 
Yes, you have done it again. I have been using your Voyager home page for about the last 8 months or so and I can see that you have kept the ball rolling with this one. Excellent work!
 
jeopardy98 said:
Yes, you have done it again. I have been using your Voyager home page for about the last 8 months or so and I can see that you have kept the ball rolling with this one. Excellent work!
ditto for me. your a beast mkleiman.
 
Great work. I cannot wait to try it out.

peace, b.
 
same here man hit me up with an im when you get it working
 
Storm Home Page

Hello Storm fans! I'm back with good news ... my home page is working well on the phone, and I'm ready to share it with the world. The page is hosted at:

http://stormpage.freehostia.com

Feel free to check it out, and if you like it, you can either bookmark it or set it as your home page.

(Note: you can check out the page from your computer browser too. The basic layout and links work pretty well in Firefox, IE and Opera. However, some of the alignment and sizing might look odd on your computer because the template is designed to render ideally on the Storm browser.)

I also created an informational page to assist people using the home page. You can find it at http://mkleiman.googlepages.com/storm. Here you will find detailed instructions for getting to the Storm Home Page from your phone's browser and how to set it as your start page in the browser. The site also explains how to customize the weather drop-down tab for your location.

------------------------------------------

A note about the content: I tried to include a broad cross-section of popular links, and I included the wap version of some sites rather than the full html versions where I felt that the wap versions gave very functional access to the site's content.

If you don't like the sites I listed, or if you think I missed a crucial link that would appeal to most users, I may consider changes. To add links of your own interest, however, you will need to customize and host your own version of the page.

To that end, if you are comfortable doing basic html editing, you are welcome to edit the template to change the folders and sites. To customize the template with your own favorite links, you will need to download the template file, edit the link files, and then host the file on the internet. If you do not know how to edit html files or how to host a webpage on your own hosting service, I do not recommend attempting a customized version at this time. I will endeavor to prepare detailed tutorials on these topics in the future.

You can download the template file at http://mkleiman.googlepages.com/storm.

------------------------------------------

Thanks everyone for their support so far, and I hope you like the home page. Enjoy your Storms! :2thumbs:
 
awesome, thanks for upping this... :buddies:
 
Back
Top