Monitor Resolution

Keeping circles round at various resolutions. (for Geometry Demonstrations)

March 11 , 2008

This animation seems to be showing the correct aspect ratio but there are problems with naming or something in the Scripting - time is too short to correct : aspect_ratio.html

There may be a bit of a hiatus here but I expect to follow up, if only for the Actionscripting experience. Currently using AS1 and want to get to AS3 - may take a bit or a byte as well.

I would think now that now that Macintosh has apparently stopped distorting circles, (Resolution Independence, Leopard 10.5) Microsoft will be doing whatever it takes to do the same, fairly quickly; no guarantee, they have their own Expression Suite they may want to emphasize, but there are 3rd party programs advertising it which may be gobbled up, MS has some ideas of it's own, i.e. http://research.microsoft.com/~cloop/LoopBlinn05.pdf
and I suppose they could surprise me and lease the Mac Technology.

There will still be older software and computers, possibly for some time, and I can use the Scripting experience so I expect to follow up, the plan: 1. range of aspect ratios, 2. actionscript to smooth out circles based on some average of each range. 3. apply to applicable parts of "Circular Functions 5 animation as that seems to be the one most likely to address the problems seen so far.

Again, there is a fair chance this will take some time.

March 10 , 2008

This animation shows a conditional change of dimensions on the variable "e", the aspect ratio. At least some of it is working.
resolution_mar10_4.html
CAVEAT- In order to test this it is necessary to change resolution repeatedly, this inconveniently repositions my PC desktop icons and I presume it will do the same for yours, please be prepared if working from a PC. I ended up using: Desktop>Rclick>ArrangeIconsBy>AutoArrange, now at least they stay in the same place even if it is the same wrong place- I'll adjust.

March 8 , 2008

This animation shows a conditional change of dimensions on a few common screen resolutions (Note that I had to make a few changes in the original animation as well as add in the code noted): scene_modified_2.html

Proceedure

1. CAVEAT- In order to test this it is necessary to change resolution repeatedly, this inconveniently repositions my PC desktop icons and I presume it will do the same for yours, please be prepared if working from a PC.

2. Click on the link above

3.Change your monitor resolution to 1024 or 800 or whatever is written in the script on the animation. (PC, XP - Desktop > Rclick> Properties> SettingsTab> ScreenResolutionSlider) (Mac had a monitor icon> SystemPropertiesPreferences? and more options)

4. Refresh the animation (View>Refresh)

5. Verify if the image has changed. Some work, some don't. There is more for me to do. Everything is currently exagerated and practical changes should be much less.

6. I found the code at http://www.actionscript.org/forums/showthread.php3?t=130355by Noct, dated 03/07/2007

***

NOTE: after going through the above and going to the Macintosh lab at school apparently they upgraded to OS 10.5 Leopard and now have "Resolution Independence" a patented technology.

See: http://blog.wired.com/gadgets/2006/12/apple_patent_pe.html
http://www.bltt.org/accessibility/resolution_independence.htm

At any rate, All my circles looked round (pretty much, nothing objectionable) regardless of what resolution or browser I used so the new code doesn't do anything bad and is probably ok and should work for older macs and current PC's and, while I'm at it, some of the animation doesn't look as good at the higher resolution and could use a bit of upgrade so I might as well see what can be done. Microsoft will presumably be doing something equivalent reasonably soon but older computers and OS's of all kinds will probably be around for awhile given the current economic conditions.

http://en.wikipedia.org/wiki/Computer_display_standard - shows some of the various resolutions and pixel aspect ratios; historical, contemplated or in actual use. Their apparently unending variety (necessitated by technology innovation; pda's,laptops, cellphones, etc.) indicates I think, why any resizing put into code should be based on aspect ratio (pixel or otherwise). I should think a formula which resizes the .swf content (i.e. mc's) based on the difference between authoring and user aspect ratios (probably a range of ratios) might be a solution, though redesign to take this into account appears necessary to keep some mc's from running off the page.

I do not yet know if this is possible. To be worked on as time allows.

March 5 , 2008

What I'm thinking of right now is a conditional statement with or without a function in which the capabilities.resolution (x/y) is evaluated (if that is the right word) and if it's not the same aspect ratio that was used to create the movie, then the mc of the circle inside the movie is resized so it looks round.

The idea would be to resize based on aspect ratio (presumably ranges of different ratios), that way HD monitors could go up to 4000x3000 or whatever but the resizing would still work.

The circles don't have to be absolutely perfect, they just have to look more like circles than ovals, the quicker the viewer jumps to the conclusion that a circle is being demonstrated the better. The viewer can also be educated to the values of some tolerance by slight imperfections - but slightly less imperfect than I'm seeing now.

I have no idea whether this is possible.

Before going to the forums and pleading my case I'll do some research so if anyone responds I'll be able to copy and paste the code better. It is no longer possible to keep a Flash site going without some more Actionscript knowledge than I have so this is a good time for me to give it another go.

March 3 , 2008; experiments; 2&5 below show that resizing is possible I will try this out on one of the circular functions animations first to see what such resizing of dimensions does to it.

Also, this may have something as well.

http://www.13dots.com/forum/index.php?showtopic=328
100% Movie Size Without Distortion. - 13Dots Forum

March 4 , 2008

Stage.scaleMode is tried below (unsuccessfully), the code is placed in the first frame of the movie - it dictates how the movie is sized relative to the player. But it's not really what I want. The first one, exactFit will reshape the mc in the animation so it can be dragged into the shape of a circle (If the winow is not maximized) but ideally, a first time viewer would go through the animations intuitively, quickly, without having to figure out unessessary proceedural steps, whether they're justified or not, etc. There would be as few distractions from content as possible.

resolution_mar4_1_exactFit.html

resolution_mar4_2_showAll.html

resolution_mar4_3_noBorder.html

resolution_mar4_4_noScale.html

if they don't work I'm thinking of something like the following:

http://www.dynamicdrive.com/forums/showthread.php?t=27933

BLiZZaRD

well, you could try something like the following:

var e=(screen.width/screen.height);
if (e=1.66){
window.location.replace("http://www.example.com/page2.htm");
else{
window.location.replace("http://www.example.com/");
}and just add an if for each major aspect ratio (I think there are 6 or 7) umm.. 1.33, 1.37, 1.66, 1.78, 1.85 and 2.35 are the ones I know off the top of my head.

but just resizing the mc, not replacing the animation itself :

March 3 , 2008

Continuing my quest to keep circles round on everybody's computers, these experiments; 2-5 below, can change the dimensions of the movie clip based on the user's screen resolution using Flash's Systems Capabilities Object. At least they can change it on my own computer when I remember to refresh the animation. More trials to follow, Might try also "listeners" as suggested below (February 8) but this will apparently take more reading and time and if this version suffices to keep my circles round regardless of the user's settings this may be all that is needed. Everything is a bit exagerated here as a first trial.

1. Click on the various links below

2. CAVEAT- In order to test these it is necessary to change resolution repeatedly, this inconveniently repositions my PC desktop icons and I presume it will do the same for yours.

Change your monitor resolution to 1024 or 800 or whatever is written in the script on the animation. (PC, XP - Desktop > Rclick> Properties> SettingsTab> ScreenResolutionSlider) (Mac had a monitor icon> SystemPropertiesPreferences? and more options)

3. Refresh the animation (View>Refresh) ( I didn't do this yesterday and thought the script was no good at all, so I don't know yet how these will work on other computers or the various browsers).

4. Verify if the image has changed. Some work, some don't. There is more for me to do.

5. I found the code at http://www.actionscript.org/forums/showthread.php3?t=130355by Noct, dated 03/07/2007

resolution_feb29.html

resolution_feb29_2_widthBlank.html

resolution_feb29_3.html

resolution_feb29_4.html

resolution_feb29_5.html

February 8, 2008

RE: keeping circles round on new higher resolution monitors with differing aspect ratios.

Using some new string searches from the musemath statistics page and feeding them back through Google, I get the following ideas.:

(I'm dealing largely with Euclidean geometry so I think they will have to be tried out.

For an undeveloped programer, hardly a designer such as myself this may take a while.)

http://www.actionscript.com/Home/tabid/36/Default.aspx?rdtArticle=mastering-full-browser-flash-part-2

...takes a look at the building blocks for HTML and ActionScript. Our HTML settings for the SWF movie will allow the movie to scale while the ActionScript keeps our content from distorting.

...It offers you the designer/developer to present a layout that isn't entirely restricted to the user's monitor settings.

http://www.dreamincode.net/forums/showtopic38281.htm

...resizing flash based on resolution..

Create a text field instance name of "resolution_txt" and place code

Code:
///////// User Resolution Info into text field //////////////
resolution_txt.text = (System.capabilities.screenResolutionX) + " x " + (System.capabilities.screenResolutionY);
Then run whatever "if" and "else" statements needed for the logic against the value of "resolution_txt".

Set up "if" and "if else" conditionals for every resolution to scale the movie for you. Then research "scaling" or "scale" your movie size through ActionScript to plug in between the conditions where appropriate.

Something like: (just quick example)

Code:
if (resolution_txt.text == "1024 x 768"){

// Do actionscript movie scaling here for it

} else if (resolution_txt.text == "1360 x 768"){

// Do actionscript movie scaling here for it

}// and any more you want to do__________________

http://www.flashthing.com/blog/2007/12/alterations-on-resize-f8.html

Alterations On Resize [F8]
This seems to be the question that I am asked most of my flash stuff, "How the hell do you get it to change on screen or stage resize?"

Here is the answer so stop bugging me about it...

Stage.align = "LT";
Stage.scaleMode = "noScale";
stage = new Object();
stage.onResize = function () {
//This is where the resize script goes.
}
Stage.addListener(stage);
stage.onResize();

Explanation.

1) Align everything to the left top ("LT"). This makes everything relative to the top left so that 0,0 is a standard start point.
Stage.align = "LT";

2) Stop the objects from scaling. If you are using pictures, stretching them will distort them unless a ratio is maintained - but then you never know what the size of the browser is going to be. Once this is set, you will have decide how big everything is going to be as they will now have to be set.
Stage.scaleMode = "noScale";

3) Make a new object stage (small s.) I know this is against tradition, and you can call it anything you want, it just makes it easier to remember.
stage = new Object();

4) Make the resize function. When you are using this you should make it so that everything is relative to Stage.height, and Stage.width. As you will notice, unlike all other objects, the (_) underscore before the width and height is not there. If you get errors in the script, nine times out of then, this will be the problem.
stage.onResize = function () {
//This is where the resize script goes.
}

5) Add the object as a listener to the stage. Whenever the stage is resized then, the resize function will be called inducing the change in the objects in real time.
Stage.addListener(stage);

6) Run the function. This is here so that the resize script is called at the start. This is important and should not be removed; however, you may have to put it at the end of your script as the affected objects might not be loaded if it is running too soon.
stage.onResize();

September 23, 2007

I have no answers here, for the most part the animations look ok - on some monitors distortion caused by higher resolutions, different aspect ratios, wide screens with older video cards etc.cause the circles to look like ovals. The animations were created on a stage of 550:400, 1.375 aspect ratio - I will probably just put some kind of notes somewhere and let it go for now.

May 5, 2007

1. New animation flash_resolution.html

2. High Display DPI (PPI) is and apparently will be a continuing problem - distortion and small print. Obviously, I am not alone. I can find no ready solutions. My site is still faring better than many others but resolution is expected to continue to increase and the problem has to be addressed if not immediately solved.

The immediate problem for me is that on one school campus the 15 inch LCD Monitor has a native resoltion of 1280 x 1024 but is set to 800 x 600 so the text is large enough for the students to see what they're typing. Unfortunately, this results in very poor quality image and for me, more importantly, the distortion of the Flash animation particularly noticeable on circles and squares.

Apparently, with an LCD monitor, changes in resolution should be in integral multiples (same idea as in string overtones - 1/2, 1/3, etc.) that is, you could change a 1600 x 1200 LCD to 800 x 600 and still have good quality, but a 1280 x 1024 would look best at 640 x 512 and there is no such setting in the OS.

I can reset the monitor to 1280 x 1024 and the Flash looks fine but then I need the XP magnifier (Start>AllPrograms>Accessories>Accessibility>Magnifier) and/or the Internet Explorer 7 browser's Zoom feature for most everything else. This is inconvenient to say the least and many potential viewers have no idea such things exist.

I understand the Flash problem has to do with its fixed 72 DPI (PPI) in the source code which is still extant I believe on the new Adobe CSR Version just released though they seem to be paying some attention to the distortion problems, at least so far as raster images are concerned.

The problem may get much worse with the very high resolution displays due out in a year or so (200 DPI).

2. I have experimented with designing for the Flash Zoom feature ("Ratios 1, 2, 3") - it shows all the flaws in the work and few benefits for me since I can enlarge the content without increasing the resolution of the display. It generally requires more precision and time in the design which affects some of the enjoyable spontanaity of creation. Nevertheless, it is here, it has its uses and must be dealt with.

April 28, 2007

1. Several Test Animations re: pixel aspect ratio. I will check these out Monday.

Test_pc_1

Test_mac_1

Test_mac_2

April 25, 2007

1. Another experiment re circles and ovals Flash Dimensions - detecting user settings to determine the source of the problem. This should give readouts from your own operating system settings. I hope to eliminate a suspected problem on my own equipment at home which by now pretty much qualifies for "Antiques Road Show". I don't want your settings, I want the school's settings, this is supposed to be "read only" and perfectly safe, you can trust me, I used to be a lawyer.

April 20, 2007

1. Some experiments with Prosthaphaeresis Animation. Basically, when I stared this website my circles were all round, but some time ago, they turned into ovals. I assume this has to do with "aspect ratio", possibly due to video/pda issues - I don't really know. It doesn't happen on my computer, just on most everybody else's. Same thing can be seen on many applets and other peoples Flash pages.

Right now, the only way to get round circles is to set the monitor to 1.25 aspect ratio. (W 1280 H 1024).

The circles don't have to be perfect but they have to look more like circles than ovals to keep the interest of the viewer. Just like with a tempered scale, some tolerance is ok (in my opinion, good - the words "play" and "tolerance" are related - a little room for error should be acceptable to the fallable), but too much error is unacceptable and calls into question the entire work. The circle in the animation was made intentionally as large as possible to see what could be done and now it is time to experiment.

So far:

Surprisingly little on googled inquiries, mostly concerned with video and Flash Lite.

I have tried modifying document properties (proportions of stage) and Publish>HTML>Dimensions>(percent is always used to enable resizing) changing Height and Width of the movie. These did not fix the problem.

Now I'm trying: Publish>HTML>Scale>No scale:

And, here I distort one of the individual movie clips to see if a round or more roundish circle appears on page 6. Everything else will be out of scale. This will work when I get the proportions right but it is not very practical for working in the authoring enviornment.

The big problem is that I can't see the results till I get on the school compter in a couple of hours.This will go on for some time,

Back to top