2
\$\begingroup\$

Right now I am experimenting with XAML and C# to write a small Windows Store App which supports displaying a playmat with cards. However not everyone uses the same resolution and with a somehow fixed layout I run really fast into some issues. Having a really high resolution yields

hi res screenshot

where all the zones are huge (and ugly stretched) and the icons as well as the fonts are really small. Changing to a low resolution yields

low res screenshot

which is okayish so far, yet I would need to find out how to scale assets like the displayed card such that it fits the zones.

Are there any best practices, creating such fixed layouts and optimizing them for different resolutions? How should I correctly compute the sizes for a card on the table? And is there anything to keep in mind when creating fullscreen content for different resolutions?

Improve this question
\$\endgroup\$

1 Answer 1

Reset to default
2
\$\begingroup\$

You can base everything's size on a percentage of the screen space it should take up; for example, a card may take up 5% of the screen's width and 7.5% of its height (these are just examples).

Before you do that, you will want to go with a resolution such as 800x600 that simplifies the math to find the percentage values. Then as long as you use the relative percentages everywhere instead of absolute pixel values, it should work. Note: this is a lot easier to do in 2D, but should carry over for 3D theoretically.

--You may also want to find the aspect ratio being used as well. Going from 800x600 to 1920x1080 would cause your cards to get fat horizontally.

Improve this answer
\$\endgroup\$
1
  • \$\begingroup\$ Luckily this is 2D and the plane is being projected into 3D space using XAML and DirectX. Pretty nice effect. \$\endgroup\$
    – Christian Ivicevic
    Apr 12, 2013 at 22:13

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .