Web Application Interface/ GUI

[steviewdr]

Hi All,

Happy Easter - hope ye had a good one.

I have to design and build an Information Portal for my research. I want to have the "best" user interface and experience for the user when using this Information Portal Application. [b]
I want this Web Application/ Portal to handle like a Desktop Application, in terms of GUI/Design and Speed.[/b]

First - Layout of Web Application.
I have looked at control panels and I like the interface used by plesk ( [a href=\"http://freshmeat.net/screenshots/16671/63992/\" target=\"_blank\"]http://freshmeat.net/screenshots/16671/63992/[/a] ) They use FRAMES!!! to simulate and boast a "Desktop" experience with the Web App.

[b]I have done out a mock-up of a layout (using css and divs) Im thinking of using. Its at:[/b]
[a href=\"http://kartbuilding.net/misc/portal/\" target=\"_blank\"]http://kartbuilding.net/misc/portal/[/a]

Dont worry about Colours and/or Text - its only the Layout Im worried about - scrolling and the such like.
[b]Have ye got any ideas on what ye would consider to be the "BEST" layout for a Web App?[/b]
Basically I want to reflect a Desktop Application which is Very Intuitive and Simple to Learn with a 0 learning curve.


[b]Secondly - before I start doing loads of stuff I have a Question ->[/b]
Situation:
There are several pages with little content, with perhaps 1 or 2 images max.
I want the FASTEST possible Switching time/Loading time.
Method 1: Use DIV's which can be turned on/off with display: none | display: block via javascript
Method 2: In the same page - use Ajax to pull the new text in and display it on the fly in the background.

Hummm...Im thinking I will have to use a combination of both methods. What are your ideas?

Any enlightenment would be greatly appreciated.

Best Regards,
Steve

[ober]

For the layout, I don't personally know many applications with much on the left/right sides. Most apps have a top-down approach with most of your tools located along the top. If anything, the left side should be nothing more than a "toolbox".

From a usage approach, the fastest switch would be hidden divs... but be prepared to throw in a fair amount of AJAX for some of the other calls. Also keep in mind that your app completely breaks using either of those approaches if the user has JS disabled. Probably not anything to be too concerned about, but it's worth some thought.

I personally don't think it's necessary to provide something like this. The web is what it is and people that expect the speed of a website to match that of a desktop app don't understand the technology.

However, having said that, I've thought about something recently that may or may not help you. One of the main problems with an application like that is getting real-time data without some sort of refresh. But what if you fired an event in the background that was based on a timer or whatever that did nothing but update the hidden divs. That way you could swap them out at will and they'd always have accurate data. You could easily check to see which ones are hidden and which ones aren't and only update the ones that need to be changed. It could get very complicated, but could come close to what you're after.

I don't know if that's just my ramblings that'll confuse you or if any of that will help, but good luck with it.

[redbullmarky]

hi steve
i think you already gave an app of mine a spin. its based on plesk (which in turn is based on windows xp) but without using frames. i think it depends what youre trying to achieve. mine doesnt use ajax but DHTML/javascript/CSS, etc.

in using a plesk-style layout, my own package has kinda 'dumbed down' something which can be quite complex, which has made things ridiculously easy to get around and use, even for a beginner. i think if you can model your web app around something that's familiar to most people (ie, WIndows XP), then you can't go far wrong.

how you go about it will depend heavily on what you want to achieve and whether it warrants a large, userfriendly interface.