Photo-realistic GUI

[Craig Webster]

I see a lot of cool control GUI's where the knobs, sliders,
LED's etc. actually resemble the real thing.
Is this achieved by simply manipulating pre-drawn bitmap images
of the various elements or is there some form of utility out
there to simplify this?

Thanks for any advice.

Craig Webster


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

[Patrice Terrier]

Craig,

Most of the time this kind of photo-realistic GUI use "Skin" technology.
The whole GUI is splited in several bitmap pieces matching each of
the GUI components. And you must use a "Skin" engine program to handle
everything.
Look at this url there are several interface examples:
http://www.zapsolution.com/winlift/gallery.htm


------------------
Patrice Terrier
mailto[email protected][email protected]</A>

[Craig Webster]

Hi Patrice,

I think I was one of your first customers for Winlift but this is
not what I am looking for. I want to develop a user interface
that resembles a hardware component.

The following link will give you an idea of what I want to
achieve.
http://www.sonictimeworks.com/products.html

Regards,

Craig Webster

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

[Jules Marchildon]

Craig, those images are based on similar technology.

For instance, here is a C++ demo with source code...

http://www.planet-source-code.com/xq...s/ShowCode.htm

Check out the "Wet Logo", that is really Cool!

p.s. When starting the EXE, check your Tray for a Green Icon.

Regards,
Jules

[Patrice Terrier]

Craig,

As Jules said this kind of stuff uses the same technology.
But it needs to create a dedicated skin for each of the interface.
Also it uses static windows that is somewhere easier to handle than
dynamic windows (resized windows).
You must first design the bitmap with all the components (the artistic
part of the job) then create hot spots on this bitmap matching
the components and paint them in order to react to user input.

This could be done with a dedicated engine but not with multi
purpose tools like WinLIFT or WindowBlinds. The hard work is to create
a standard UIS (User Interface Specification) to be able to change
the skin on the fly.

It is the kind of job i love to do, but it is very time consuming


------------------
Patrice Terrier
mailto[email protected][email protected]</A>

[Lance Edmonds]

I'm surprised that no one has suggested owner-draw and/or custom controls as an alternative to a "skin".



------------------
Lance
PowerBASIC Support
mailto:[email protected][email protected]</A>

[Borje Hagsten]

Yes, should be easy to do, but remember, while it may look nice,
it isn't always the best solution for a screen. A place I worked
for in the past ordered a piece of software from a team of developers
here in Sweden. They did a photo-realistic interface, just like these
and it was almost un-usable. They had to remake it and use standard
Windows controls instead, because we found it both cluttered and
hard to control with the mouse.

Not that same thing, turning a knob in real life, compared to do
it with a mouse and since meters responded fast, all one saw was
that thin line, flickering back and forth on the screen. Screen
resolution isn't the same as real life view, so anything small or
thin becomes impossible to work professionally with, on daily basis..


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

[Lance Edmonds]

I would not recommend dismissing such techniques simply based on the experience with one (obviously very poor) implementation.

I've seen some stunning owner drawn controls which were both usable and easy to use.

------------------
Lance
PowerBASIC Support
mailto:[email protected][email protected]</A>

[Patrice Terrier]

Lance--

>> I'm surprised that no one has suggested owner-draw
>> and/or custom controls as an alternative to a "skin".

Most professionnal skin engine I know do use owner-draw and custom controls.
And at least WinLIFT does

Custom controls is the ultimate way to go if you want to have
full control on everything.
But as I said already, you must create a UIS that will allow to change
the bitmap components without changing the EXE.
The capability of changing the interface without changing the code,
and the programming logic, is the main feature of a "Skin" engine.




------------------
Patrice Terrier
mailto[email protected][email protected]</A>

[Craig Webster]

Originally posted by Borje Hagsten:
Yes, should be easy to do, but remember, while it may look nice,
it isn't always the best solution for a screen. A place I worked
for in the past ordered a piece of software from a team of developers
here in Sweden. They did a photo-realistic interface, just like these
and it was almost un-usable. They had to remake it and use standard
Windows controls instead, because we found it both cluttered and
hard to control with the mouse.

Not that same thing, turning a knob in real life, compared to do
it with a mouse and since meters responded fast, all one saw was
that thin line, flickering back and forth on the screen. Screen
resolution isn't the same as real life view, so anything small or
thin becomes impossible to work professionally with, on daily basis..

Oh I can show you many examples that work very well indeed.

I can achieve the desired result by manipulating pre-drawn bitmap
images (using PB-DLL and Perfect-Sync) but I am wondering if that
is the long-winded way. Just my luck to invest months in a
development to find that there was a much more simple, direct way.

My application will run on a dedicated machine so I don't have to
worry about interacting with other app's or re-sizing. I just want
to produce several, rich, photo-realistic panels with big, chunky,
3D knobs, switches, and meters (I use touch-screens).
I also want to be able to switch from one panel to another
instantly (as I did in DOS on a 386-25)without the annoying
Windows sputter.

Thanks for the replies.

Craig Webster


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

[Chris Boss]

Craig;

Looking at the URL you posted (for examples) , I can almost guarantee
you the developers of such software "didn't" make those PhotoRealistic
controls themselves. Most likely they are ActiveX controls and I wouldn't
be surprised to find that the apps are written using VB.

The advantage of ActiveX controls is that you can buy these real
great looking controls from other companies and just simply plug them
into your VB app. Most VB programmers don't make their own custom controls,
but they buy a bunch of ActiveX controls from other companies.

The same thing can be done with PB, using custom controls in DLL
form, but the problem is that most companies that build custom
controls usually only make them as ActiveX. There are a few companies
that make their custom controls as both ActiveX and DLLs.

I would start searching for custom controls and buy what you need.
If you can't find what you want in DLL form, then buy ActiveX controls
and use the third party tool (I forget the name) available for
integrating ActiveX controls in a PB app.

I wouldn't even attempt to write your own at this point, since
companies that make such controls put a lot of time effort into
writing such things and it would be very hard to produce something
of such high quality in a short period of time.

If you must write your own custom controls, you will have to do some
serious research into writing custom controls and using the GDI.


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


[This message has been edited by Chris Boss (edited March 06, 2001).]

[Craig Webster]

Originally posted by Chris Boss:
Craig;


I would start searching for custom controls and buy what you need.
If you can't find what you want in DLL form, then buy ActiveX controls
and use the third party tool (I forget the name) available for
integrating ActiveX controls in a PB app.

I think that would be the JAZZage product(?)

I once emailed the author of one of these GUI's and his reply was
that he used a well know paint-type program (!??)

Left me wondering how he made it DO things. So I assumed that he
painted the various elements in different states and simply
overlaid the BMP images as required.

I will take your advice and search for ActiveX components.

Thank you.

Craig Webster


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

[Jules Marchildon]

Craig,

Check out just the skins used for WinAmp, you will see the complexity
of what is required from the programmers point of view. Down load one of
the skins and just browse thru each component that makes up the skin.

I like Lances' suggestion, maybe we should make a few custom controls, for
one I like Knobs and LED's (just because I use them in my own hardware projects).

http://www.1001winampskins.com/

Regards,
Jules

[Gary Akins]

All I know is, I'd like to "skin" whoever it was who came up with the stupid things in the first place...

Since Craig's application sounds like it's for an information kiosk, or some other dedicated device where there's no need for consistency with any other program(s) on the system, it's probably not such a bad thing, but I really don't like seeing them used on "standard" Windows applications... wasn't one of the main ideas of Windows (and MacOS, for that matter) to provide a consistent user interface across all applications?

(Sorry, but I think these "real-world object" interfaces are one of the most gawdawful inventions I've ever had the displeasure to tangle with, and I adamantly refuse to use any program which uses them if I can avoid it. The fact that I - a self-admitted "cheap bastard" and proud of it - willingly spent $400 for ULead Media Studio Pro, just to get away from the "photo-realistic GUI" of the video-editing program that came with my firewire card, should tell you how much I loathe them...)

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

[Tom Hanlin]

A consistent user interface? Oh, you mean like the Find function in Microsoft
programs, which is consistently Alt-S, or Ctrl-H, or Ctrl-F, or Alt-E F, or
maybe not available from the keyboard?

------------------
Tom Hanlin
PowerBASIC Staff

[Craig Webster]

Originally posted by Jules Marchildon:
Craig,

Check out just the skins used for WinAmp, you will see the complexity
of what is required from the programmers point of view. Down load one of
the skins and just browse thru each component that makes up the skin.

I like Lances' suggestion, maybe we should make a few custom controls, for
one I like Knobs and LED's (just because I use them in my own hardware projects).

http://www.1001winampskins.com/

Regards,
Jules

That's gorgeous stuff (IMO). Is that not possible with Winlift?

I searched for ActiveX controls and found http://www.mediabuilder.com/8801.html

But, again, I want rotating knobs, LED's, etc.

Thanks again

Craig Webster


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

[Borje Hagsten]

Someone already has posted an excellent base for a rotating knob
control. Just add whatever graphics you need. As for Led's. Simple
STATIC control and a couple of images loaded into memory is all it
takes via STM_SETIMAGE. Can become very realistic with little work.

Same goes for user interface - paint an image on to the dialog's
background. Jules recently posted an excellent button sample with
buttons of all shapes and colors. Using regions and loaded images,
almost any control can be made to look photo-realistic, but question
still remains - is it worth it?

For games, yes. For simple utilities, maybe. For advanced applications,
usually no, because software always becomes harder to work with, the
more cluttered and "non-standard" it is..

(He, who am I to talk - working on next version of Poffs here and have
written several new custom controls for it, all "non-standard"..


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

[Gary Akins]

Well, see, there's another good reason not to use Microsoft programs. All the (non-Microsoft) applications I've used have, to date, pretty consistently used CTRL-F as a shortcut to the "Find" function, or ALT-E-F if you insist on pulling down the whole menu first...

Seriously, though, the "consistency" I was thinking of is the basic consistency of what a button looks like, what a listbox or a scrollbar looks like, where the menu bar can be found, and so on. The video-editing software I referred to earlier is a good example: ULead's "consumer" package, called Video Studio, uses one of those "skinned" interfaces, and so do the newer versions of MGI VideoWave. I defy you to install either of those programs and know, without having to move the mouse pointer over every single button and wait for the tooltips to pop up, how to do something as simple as opening an already-existing AVI or MPEG file. I further defy you to figure out how to open two files, join them together, and save the result to a new file without again moving the pointer around every single control in turn, since some of the controls change function depending on the operation in progress and none of the controls are labeled!

It took me no less than an entire evening to do the simple operation referenced above, because I was constantly having to pull up the online help or read through the manual to remind myself what the half-dozen round buttons with the aesthetically-pleasing, but utterly non-intuitive symbols did. By contrast, when I installed Media Studio Pro - the program which uses the "normal" Windows interface - I was capturing and editing video within the hour... (and a lot of that time was actually spent trying to figure out which "camera-control" driver my camcorder wanted, not trying to figure out which unlabeled button the "Camera Properties" menu was hiding behind. )

Now, fancy controls can have their place - even Media Studio Pro has a couple of them, on the "video preview" windows - but only where it's clearly obvious what the control is and what it's for. (Such as MSP's "jog/shuttle knob" control to move back and forth through a clip - the use of which is not only obvious to anyone who's used any higher-end VCR of recent vintage, but easily grasped by anyone who hasn't seen one before since the control only has one purpose that never changes.)

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