Go Shopping Cart Site Map User Panel and Admin English Home

Home > Easypano Forum    Easypano Forum has been upgraded.

Easypano Forum


Welcome Guest Register Login Search The Forum Display List of Forum Members
 All Forums
  Tourweaver
 
Subject Topic: How to design for full screen? Post Reply Post New Topic
Message posted by WideEyes on July-14-2011 at 6:26am
View WideEyes's Profile Profile   Search for other posts by WideEyes Search   Visit WideEyes's Homepage www   Quote WideEyes Quote   Send Private Message Send Msg  
WideEyes
Standard Member
Standard Member
Denmark
April-15-2005
57 Posts

Hello everyone.

I am an old TW user, now returning to TW as it is the most user friendly program that I know. Now I just hope that all the bugs won't keep me out of business *lol*

Now for my question:

How do I design for full screen / full browser window tours? I could ofcourse make the main window and screen viewer 1920x1080 for full HD, but that would not look good on a 1024*768 screen as not all of the elements and graphic would be visible.

So how do you guys design for a full screen / full browser window tour?

Thanks for the help :)

Regards

Morten

 


Message posted by pixelator on July-14-2011 at 8:35am
View pixelator's Profile Profile   Search for other posts by pixelator Search   Visit pixelator's Homepage www   Quote pixelator Quote   Send Private Message Send Msg  
pixelator
Standard Member
Standard Member
United States
April-21-2005
502 Posts
Hey Morten, good to see ya!

Pick your poison with tour default size. I always tried to keep the folks who never do updates, still running 98 with IE6 and a resolution of 800x600 in mind.

I have since moved forward leaving those folks behind. If your end user is looking at a virtual tour, odds are they are running a pretty quick machine with a default resolution of 1024 x 768. That said my default size these days are around 900 - 1000 px. Image size for the scenes are are stitched at 6000 x 3000 and sized down to a 4000 x 2000 and saved for the web at around 1.5 - 2.0 MB.

When the tour is finished and for publish be sure to have the Full Screen selection checked.


Hope this has helped.
Regards,
Pixel

Message posted by WideEyes on July-14-2011 at 9:07am
View WideEyes's Profile Profile   Search for other posts by WideEyes Search   Visit WideEyes's Homepage www   Quote WideEyes Quote   Send Private Message Send Msg  
WideEyes
Standard Member
Standard Member
Denmark
April-15-2005
57 Posts

Hi Pixel

Thanks for welcomming me back :)

I understand what you say and that it is possible to pick which size you want to design for. But why do I have to choose if I want to design for a 800*600, or a 1024*768, 1920*1080 or whatever screen resolution. Is it not possible to design for 100%*100% and not a fixed size?

Regards Morten


Message posted by WideEyes on July-14-2011 at 9:54am
View WideEyes's Profile Profile   Search for other posts by WideEyes Search   Visit WideEyes's Homepage www   Quote WideEyes Quote   Send Private Message Send Msg  
WideEyes
Standard Member
Standard Member
Denmark
April-15-2005
57 Posts

Cool :)

I found my own solution. I am in no way certain that it is the correct solution, and if anyone else can tell me how they are doing it, I would surely appreciate it. I might as well learn it correct from the beginning :)

So what you have to do in order to launch a tour that automatically shows 100% of the browser window no matter which screen resolution the user have is:

1) Deside the minimum screen resolution you want to design for. I don't believe anyone really still uses 800*600 so I will design for a 1024*768 window (guess it should be smaller as the browser window never display 1024*768).

2) Build the tour as you normally would in the 1024*768 window.

3) When you place any features as thumbnails, map etc. remember to use the alignment tool

4) Publish your tour as you normally would.

5) After you have published, open the "TourWeaver_XXX" file in an editor (dreamweaver, notepad or whatever you are using)

6) In line 15, find the place where the size is indicated (look for "1024", "768")

7) Change the numeric size to percentage so it now says "100%", "100%"

8) Save the TourWeaver_XXX file

9) Double click the TourWeacer_XXX file and see your project in 100% of the browser window - no matter which resolution you are using - as long as it is above 1024*768

The downside is that your graphic elements will be stretched.

I haven't really tested this approach so please help me and report any problems you might have doing it like this so we can all learn from it.

Regards

Morten


Message posted by vilmer on July-14-2011 at 4:00pm
View vilmer's Profile Profile   Search for other posts by vilmer Search   Visit vilmer's Homepage www   Quote vilmer Quote   Send Private Message Send Msg  
vilmer
Avatar
Gold Member
Gold Member
 
April-08-2006
218 Posts
Morten,
you can set the percentage in tourweaver. Have a look at this screenshot of a project I recently finished.
Also note the yellow bar on top. It's 2880 px wide, so it will fit any screen resolution available as far as I know. (I remember reading that somewhere, someone correct me if I'm wrong pls)
See the whole thing in action here. (I did the same with the bar on the bottom btw.)

Ronald

Ah, and graphic elements will not be stretched as far as I know.

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



Message posted by WideEyes on July-15-2011 at 3:47am
View WideEyes's Profile Profile   Search for other posts by WideEyes Search   Visit WideEyes's Homepage www   Quote WideEyes Quote   Send Private Message Send Msg  
WideEyes
Standard Member
Standard Member
Denmark
April-15-2005
57 Posts

Hi Vilmer

Thank you so much for your screen shot and your link to the tour. I acutally tried this yesterday, but it didn't work. Now I realize that it was because I had only made the main window 100% and not the scene viewer. So now it works :)

I learned a bit about how to build a tour from your screen shot of the TW project. thanks.

One thing that still bothers me is that the different elements aren't scalable. For instance - if you want the thumbnails to be in the bottom of the page and be 100% of the width, it is no problem if you design for a window that is 800*600. Then you just make the thumbnail 600pixel wide, but if you see the tour in a HD screen that is 1920pixel wide, you will only see the thumbnails in about 1/3 of the screen.

If the elements such as thumbnails were scalable, I could make it 100% of the width. That would be so much better.

Regards

Morten


Message posted by smooth on July-15-2011 at 5:51am
View smooth's Profile Profile   Search for other posts by smooth Search   Visit smooth's Homepage www   Quote smooth Quote   Send Private Message Send Msg  
smooth
Forum Moderator
Forum Moderator
Australia
November-23-2002
5401 Posts

Scalable items rarely look good. Because the images are in effect Bitmaps they are not designed to be scaled up. Tourweaver has the option to "scale" Hoptspots. If you try this you will see what I mean with the way it effects bitmap graphics.

Regards, Smooth [8D]


Message posted by WideEyes on July-15-2011 at 7:14am
View WideEyes's Profile Profile   Search for other posts by WideEyes Search   Visit WideEyes's Homepage www   Quote WideEyes Quote   Send Private Message Send Msg  
WideEyes
Standard Member
Standard Member
Denmark
April-15-2005
57 Posts

Hi Smooth

No I know that scaled items can look very poor as they are designed for a certain size. However when I work with FPP, I use scalable items where I am able to develop for high resolution and then make the graphic elements scalable so they scale down - that does not look too bad (though it isn't bitmaps - I don't know if that makes a big difference)

It's great with the option to scale hotspots, but if it's not possible with all of the parts of the tour, it doesn't help that much.

Oh well I guess I just need to keep it in mind when I design the template etc. and work around it that way...

Regards

Morten


Message posted by smooth on July-15-2011 at 10:30am
View smooth's Profile Profile   Search for other posts by smooth Search   Visit smooth's Homepage www   Quote smooth Quote   Send Private Message Send Msg  
smooth
Forum Moderator
Forum Moderator
Australia
November-23-2002
5401 Posts

All images that are not Vector are known as Bitmap (this includes .png, .jpg, .bmp, .tif etc). Yes, I have seen the FPP examples with skin elements that are scaling with window/fov and this confirms my opinion. You shouldn't do it, same as I don't like the scalable Hotspots.

Make it work with Vector graphics and I'll go along with it. This is one advantage of .svg image files and HTML5.

Regards, Smooth [8D]


If you wish to post a reply to this thread you must first Login
If you are not already registered you must first register

Forum Jump Post Reply Post New Topic
Printer Friendly Version Printable version

Powered by: - Web Wiz Guide Discussion Forums