User:Magus/Sandbox/Userbox Examples

From RabbitWiki

This is a space I'm using to play around with refining Userboxes, both to gain a better understanding of how they were originally designed and to try to refine a nice appearance for convention badges (and eventually hopefully "I Demo" badges) for the wiki.

If you go and look at the source for this page, you'll see it's a bit of a mess. Rest assured that once everything is settled and deployed to the Template namespace, the final badge will be added to a page using simply {{user attends Origins}}

Contents 1 Examples of different icon sizes 2 Examples of different box widths 3 Examples of different conventions at 32x138 4 Examples of different conventions at 16x138 5 Examples of different conventions at different sizes (stacked)

[edit] Examples of different icon sizes

Here are some samples of userboxes at different sizes. The size is the square dimension available to the icon box. Horizontal dimension can of course be played with as well.

The first (43px) is the default size of a Userbox over on Wikipedia.

Size	Badge	Badge w/ Image
43px	O Attends Origins	Attends Origins
32 px	O Attends Origins	Attends Origins
24px	O Attends Origins	Attends Origins
16px	O Attends Origins	Attends Origins

[edit] Examples of different box widths

238px is, again, the Wikipedia default for a Userbox, and is the size used above.

Width	32px	16 px
100px	Attends Origins	Attends Origins
128px	Attends Origins	Attends Origins
138px	Attends Origins	Attends Origins
150px	Attends Origins	Attends Origins
192px	Attends Origins	Attends Origins
238px	Attends Origins	Attends Origins

[edit] Examples of different conventions at 32x138

[edit] Examples of different conventions at 16x138

[edit] Examples of different conventions at different sizes (stacked)

32px icon x 138px
Attends Dragon*Con
Attends a Convention with a Long Name
Attends Gen Con Indy
Attends Penguicon

16px icon x150px
Attends Dragon*Con
Attends Convention With a Long Name
Attends Gen Con Indy
Attends Penguicon

32px icon x150px
Attends Dragon*Con
Attends Convention With a Long Name
Attends Gen Con Indy
Attends Penguicon