RFC: Visual Style 2.0 (or 0.2, as you prefer)

9 views
Skip to first unread message

Phil Bordelon

unread,
Apr 18, 2012, 11:16:53 PM4/18/12
to endgame-sin...@googlegroups.com
Folks,

I think E:S is a fine game; obviously, otherwise I wouldn't still be
poking at it after all these years. But I think that it has quite a
ways to go before it feels like something other than 60-70% of a
really good game.

One of the places I think we could make a big impact is with visual
style. Right now, E:S has no unifying style (unless you count "lots
of overlapping blue boxes" as one... and I don't). It's functional,
yes, but it feels like a "programmer interface" rather than one for
a finished game. Which is no fault of anyone's--it /was/ a programmer
interface, back when EMH wrote it for Pyweek, and while people
(particularly FM) have made it a lot more usable, it still feels...
like a programmer interface.

I've been playing around off and on with the idea of rewriting E:S
from scratch as a combination coding exercise and attempt at
revitalizing the game. Yes, I know all about how many ways that
a rewrite can fail--cf. Mozilla--which is one of the reasons I've
never actually /started/ on that ground-up rewrite. But I think
the core of E:S is actually pretty small and uncomplicated, at least
in its current incarnation; it's just wrapped in a whole bunch of
pretty nasty glue from our work over the years.

That's neither here nor there, though, and I diverge from my point.
One thing that I think could be done to make E:S shine considerably
more than it does now is to give it a single, unique, identifiable
visual style. I posted a "vector-style" world map to the non-dev
mailing list a few weeks back, but right after that I started to
work on something a little more ambitious.

Presented for your amusement, comments, and horrified reactions
(and attached to this message) is a mockup of my attempt at a
completely new E:S UI.

I should note that in many ways this UI is an explicit regression
from the current interface. I don't see it as cleanly scalable
(although it could be blitted to an OpenGL texture and scaled
that way); I did way too much pixel-bitching on the layout for
it to resize cleanly, although perhaps more of its elements could
float than I currently think. It's also got a grand total of two
colours (plus black), with one of the colours just a much darker
shade of the first. This is (obviously, I hope) a very intentional
stylistic choice, evoking old Hercules video cards and a sort of
'80s WarGames feel, but I can also imagine that many people would
find it hideous.

On the other hand, I don't think anyone would look at it and
think it wasn't deliberately designed :)

I went for iconography over characters, for obvious i18n reasons,
although there is still text (which could easily be localised at
the image level for other languages). The big box in the centre
of the bottom bar would be where text displays when you hover
over a button.

You'll also notice buttons for things that E:S currently doesn't
do. The speed control collapses the four current forward speeds
into three and adds a new one: "forward until event." There's
also a Help button that would presumably take the user into some
new interface with some tutorial information; one of the biggest
complaints about E:S as it is today is that it's pretty
inscrutable at first play.

The mockup is missing the buttons for the continents and other
locations. I have some ideas about the sort of iconography I'd
like to use for those, and just haven't had the time to pixel-art
them together.

Anyway, I'm sending this to -dev for a number of reasons. I'd
like to get it off my hard drive and into other's hands, even if
nothing comes of it, as a potential guidepost for others. I /do/
really like the style, and I /do/ think that E:S could really
benefit from something like this, but I also want to hear what
others think. And I'm not sure I have the time right now to
actually make the interface happen... which of course could kill
it even before it starts.

But I don't want that to be the reason I don't at least give
everyone a chance to shoot it down. So: tell me what you think,
about the style, the thoughts above, or anything else.

P

esmockup.png

Max McCracken

unread,
Apr 19, 2012, 2:47:02 PM4/19/12
to endgame-sin...@googlegroups.com
Well, the only thing I don't like here is the 6 buttons in the upper
left part. They don't look like buttons at all. Maybe some kind of
shadows would be good?

Phil Bordelon

unread,
Apr 19, 2012, 4:47:45 PM4/19/12
to endgame-sin...@googlegroups.com
On 04/19/2012 01:47 PM, Max McCracken wrote:
> Well, the only thing I don't like here is the 6 buttons in the upper
> left part. They don't look like buttons at all. Maybe some kind of
> shadows would be good?

The idea is that they would color-invert when you hover over them.
But, like I mentioned, it's just a mockup :)

P

MestreLion

unread,
Apr 19, 2012, 5:54:24 PM4/19/12
to endgame-sin...@googlegroups.com
All I ask is that, at least for the next 2-3 weeks, we don't (radically) change the UI, at least not now that I'm so close of finally understanding this unholy mess of classes and subclasses that is the current E:S graphics "engine".

Actually, you may have noticed I've been a bit away for the last 2 weeks, right after some massive contributions. The fact is: I'm building a parser for E:S classes and modules that output PNG diagrams. With all classes (and objects, modules, and packages) mapped in diagrams it will be easy to spot weak areas or over-engineered relations of current code.

Ok, back to the mockup: Since I started hacking E:S, my main concern has been coding, specially i18n, not design. So don't be disappointed by a relatively short feedback:

- Yes, current UI looks clumsy in all 3 aspects an UI matters: style, usability and code. So a revamp is welcome indeed

- I like very much the proposed idea of "iconifying" the UI. It's a great concept. But the icons should be dead obvious. Goal is to someone that never played E:S to be able to figure out what an icon is /before/ hovering mouse. In the mockup, "research" achieves that. It is *perfect*. The "diskete" is great, but is it "save/load" or menu too? And is "!?" the menu, options, or "help/tutorial/knowledge"?

- Also, "Cr" should be "$". No other way, since it is so universal. We could still call it "Credits" in all texts (I do like having a "neutral" currency, but current "cost 500 money" sound lame in English and even worse in other languages)

- The numeric displays are amazing! I loved the "darker" masks. Looks gorgeous even in the mockup

- Why the bottom row for CPU? CPU, AFAIK, does not have the concept of current/net as $ does.

- Monochrome, retro vintage style is ok. May be charming if well done. But PLEASE change the color to blue or green or cyan. Yellow-ish and brown-ish colors give me the creeps.

- What's the middle area in bottom for?

- Separating news/covert/public/science in UI may falsely suggest that there's a distinction between the pairs.

- "skip until event" is vital. good call! I also suggest to fine-tune current presets to make 2 faster, 3 a tad slower, and 4 slower. Currently 1 is for "get my server access ready", 2 is useless, 3 is what i use all time (alternating with 0), and 4 is "dangerously too fast to use"

Ok, not so short feedback afterall :P

evilmrhenry

unread,
Apr 19, 2012, 6:17:14 PM4/19/12
to endgame-sin...@googlegroups.com
By the way, if you're moving to a retro design, you might want to grab
some vector outlines of land masses. (The file format in question is "kml")

Phil Bordelon

unread,
Apr 19, 2012, 8:01:14 PM4/19/12
to endgame-sin...@googlegroups.com
On 04/19/2012 04:54 PM, MestreLion wrote:
> All I ask is that, at least for the next 2-3 weeks, we don't (radically)
> change the UI, at least not now that I'm so close of finally understanding
> this unholy mess of classes and subclasses that is the current E:S graphics
> "engine".

I'm not touching anything any time soon. What I was really looking was to
provoke opinions and reaction.

> Actually, you may have noticed I've been a bit away for the last 2 weeks,
> right after some massive contributions. The fact is: I'm building a parser
> for E:S classes and modules that output PNG diagrams. With all classes (and
> objects, modules, and packages) mapped in diagrams it will be easy to spot
> weak areas or over-engineered relations of current code.

Sounds interesting.

> - I like very much the proposed idea of "iconifying" the UI. It's a great
> concept. But the icons should be dead obvious. Goal is to someone that never
> played E:S to be able to figure out what an icon is /before/ hovering mouse.
> In the mockup, "research" achieves that. It is *perfect*. The "diskete" is
> great, but is it "save/load" or menu too? And is "!?" the menu, options, or
> "help/tutorial/knowledge"?

Yes, the icons are first-cuts--as is everything else in the mockup, of
course. That said, some things are /really/ tough to convey just as an
image. What is the icon for "knowledge?" I tried a book, but it's hard to
convey that meaningfully in 1-colour pixel art. I'm not super-worried,
given that there /will/ be hover-text. Presumably "!?" makes you want to
hover to see what the heck it is... and it'll tell you that it's "help."
(That one could also blink at the beginning of the game to get your
attention.)

I should note that I forgot another new one. The bottom-right of the 2x2
icon panel is meant to be the "Log." It would show all of the events that
have occurred since the beginning of the game (or maybe the last 20/50/100
/whatever), so you can see when you lost bases/completed them/etc. Another
fairly simple feature to implement that would seriously improve the
usability of the game.

> - Also, "Cr" should be "$". No other way, since it is so universal. We could
> still call it "Credits" in all texts (I do like having a "neutral" currency,
> but current "cost 500 money" sound lame in English and even worse in other
> languages)

"credits" is fine. I'm really, really leery of using the dollar sign, but
I might be swayed. Don't count on it, though :)

> - The numeric displays are amazing! I loved the "darker" masks. Looks
> gorgeous even in the mockup

I started with the numbers. More than anything else, I thought that an
8-segment display would be really visually distinctive.

> - Why the bottom row for CPU? CPU, AFAIK, does not have the concept of
> current/net as $ does.

It should. There's no reason we can't show what your current "CPU load"
is. Basically, if you have a net positive, that means that you have surplus
to use for jobs/etc. (and this can be automatic); if you have a net
negative, then you're not providing enough for upkeep and construction.
This is actually something we do a really poor job of indicating right now,
and having such a display would make it easier for players to notice.

> - Monochrome, retro vintage style is ok. May be charming if well done. But
> PLEASE change the color to blue or green or cyan. Yellow-ish and brown-ish
> colors give me the creeps.

Amber is OBVIOUSLY the One True Colour(tm), but one of the very, very handy
things about using only two colours (plus black) is that it is 100% trivial
to let players pick whatever base colour they want and calculate the darker
shade based on it. If you want to play in beautiful purple, so be it.

> - What's the middle area in bottom for?

That's the textbox. When you hover over something, that's where the long
description text appears.

> - Separating news/covert/public/science in UI may falsely suggest that
> there's a distinction between the pairs.

I'm not super-worried about that, but vertical lines between them could
further indicate their lack of correlation.

> - "skip until event" is vital. good call! I also suggest to fine-tune
> current presets to make 2 faster, 3 a tad slower, and 4 slower. Currently 1
> is for "get my server access ready", 2 is useless, 3 is what i use all time
> (alternating with 0), and 4 is "dangerously too fast to use"

Yeah, all the current presets would need to be toyed with.

> Ok, not so short feedback afterall :P

But much appreciated.

P

Phil Bordelon

unread,
Apr 19, 2012, 8:02:19 PM4/19/12
to endgame-sin...@googlegroups.com
On 04/19/2012 05:17 PM, evilmrhenry wrote:
> By the way, if you're moving to a retro design, you might want to grab some
> vector outlines of land masses. (The file format in question is "kml")

I've already done some pixely vectorization of landmasses (see my post on
the normal e-s list from a few weeks ago), but I think I actually want to go
with a more accurate continental outline in pixel form. Vectors may push
the style too far to "looks like Defcon." I'd need to play with it.

P

evilmrhenry

unread,
Apr 19, 2012, 8:04:06 PM4/19/12
to endgame-sin...@googlegroups.com

There are some huge ones out there; I'm not worried about accuracy.

Phil Bordelon

unread,
Apr 19, 2012, 8:13:14 PM4/19/12
to endgame-sin...@googlegroups.com
On 04/19/2012 07:04 PM, evilmrhenry wrote:

> There are some huge ones out there; I'm not worried about accuracy.

I was actually thinking of breaking away from the "center as world map"
model. Instead, I'm thinking of something like this (don't mind the ASCII
art):

| | | |
Orbit | | | | Moon
| N. America | Europe | Asia |
| | | |
Ocean | | | | Antarctica
| | | |
| S. America | Africa | Australia |
Far R. | | | | Transdimen.
| | | |

(the lines were more for my guidance than anything else). Each location
would be a large thwackable button, with an 8-seg display below/on it
showing how many bases you currently have there, and a pixel-art version
of the continent/location behind the button. That would allow us to use
better projections of some of the continents (Dymaxion, say, vs. the
current super-stretched cylindrical) since they don't actually have to
be adjacent/contiguous any more. The six edge buttons would obviously
only appear as those locations became available.

P

MestreLion

unread,
Apr 19, 2012, 11:32:32 PM4/19/12
to endgame-sin...@googlegroups.com


On Thursday, April 19, 2012 9:01:14 PM UTC-3, Phil Bordelon wrote:
On 04/19/2012 04:54 PM, MestreLion wrote:
> All I ask is that, at least for the next 2-3 weeks, we don't (radically)
> change the UI, at least not now that I'm so close of finally understanding
> this unholy mess of classes and subclasses that is the current E:S graphics
> "engine".

I'm not touching anything any time soon.  What I was really looking was to
provoke opinions and reaction.

> Actually, you may have noticed I've been a bit away for the last 2 weeks,
> right after some massive contributions. The fact is: I'm building a parser
> for E:S classes and modules that output PNG diagrams. With all classes (and
> objects, modules, and packages) mapped in diagrams it will be easy to spot
> weak areas or over-engineered relations of current code.

Sounds interesting.

... and gives you guys time to test my i18n branch ;)

Seriously... that branch do even more deeper and broader changes than the previous language_handling stuff, that was by itself already big branch. Theres a new i18n tool (gettext-singularity in tools/, a new workflow for translators, revamp in code, etc... so heavy testing and feedback is vital

Ok, enough thread hiijack :)
 

> - I like very much the proposed idea of "iconifying" the UI. It's a great
> concept. But the icons should be dead obvious. Goal is to someone that never
> played E:S to be able to figure out what an icon is /before/ hovering mouse.
> In the mockup, "research" achieves that. It is *perfect*. The "diskete" is
> great, but is it "save/load" or menu too? And is "!?" the menu, options, or
> "help/tutorial/knowledge"?

Yes, the icons are first-cuts--as is everything else in the mockup, of
course.  That said, some things are /really/ tough to convey just as an
image.  What is the icon for "knowledge?"  I tried a book, but it's hard to
convey that meaningfully in 1-colour pixel art.

It can't be too hard. A book is a great icon for the knowledge screen, although...
 

 I'm not super-worried,
given that there /will/ be hover-text.  Presumably "!?" makes you want to
hover to see what the heck it is... and it'll tell you that it's "help."
(That one could also blink at the beginning of the game to get your
attention.)

... knowledge should be merged with this "!?" help/tutorial screen. I think of it like the Civlopedia in Civilization.
 

I should note that I forgot another new one.  The bottom-right of the 2x2
icon panel is meant to be the "Log."  It would show all of the events that
have occurred since the beginning of the game (or maybe the last 20/50/100
/whatever), so you can see when you lost bases/completed them/etc.  Another
fairly simple feature to implement that would seriously improve the
usability of the game.

That is a GREAT idea, and indeed *very* easy to code. a global history[] list, a History class with date, type of event (which may be an object/dict by itself), and associated object. Done.

 

> - Also, "Cr" should be "$". No other way, since it is so universal. We could
> still call it "Credits" in all texts (I do like having a "neutral" currency,
> but current "cost 500 money" sound lame in English and even worse in other
> languages)

"credits" is fine.  I'm really, really leery of using the dollar sign, but
I might be swayed.  Don't count on it, though :)

Don't think of $ as "American Dollars". Think of it as the most widely known, universal symbol for "Credits", or "Currency". Or forget the symbol and go "Credits" and "CPU" for those meters. And for the icon, fs a big $ is too lame, I say go for the classic coin pile
 

> - The numeric displays are amazing! I loved the "darker" masks. Looks
> gorgeous even in the mockup

I started with the numbers.  More than anything else, I thought that an
8-segment display would be really visually distinctive.

> - Why the bottom row for CPU? CPU, AFAIK, does not have the concept of
> current/net as $ does.

It should.  There's no reason we can't show what your current "CPU load"
is.  Basically, if you have a net positive, that means that you have surplus
to use for jobs/etc. (and this can be automatic); if you have a net
negative, then you're not providing enough for upkeep and construction.
This is actually something we do a really poor job of indicating right now,
and having such a display would make it easier for players to notice.


Yeah, I completely forgot about parenthesis. But I suggest that this number is the CPU allocated to Jobs, both forced + cpu pool (or Total - (Jobs+Pool)). Currently It shows only cpu pool, so I end up never allocating CPUs to Jobs, or it gets impossible at main screen to know how many cpus are actually "making money"
 

> - Monochrome, retro vintage style is ok. May be charming if well done. But
> PLEASE change the color to blue or green or cyan. Yellow-ish and brown-ish
> colors give me the creeps.

Amber is OBVIOUSLY the One True Colour(tm),

Eeewwwww :)
 

but one of the very, very handy
things about using only two colours (plus black) is that it is 100% trivial
to let players pick whatever base colour they want and calculate the darker
shade based on it.  If you want to play in beautiful purple, so be it.

Default being green? Pretty pretty please?? :D

Yes, Matrix style... otherwise I fear too many people will close the game even before they find out that colors are selectable
 

> - What's the middle area in bottom for?

That's the textbox.  When you hover over something, that's where the long
description text appears.

Humm, I like that :D

Better than a mouse tip label.

And *very* vintage :)
 

> - Separating news/covert/public/science in UI may falsely suggest that
> there's a distinction between the pairs.

I'm not super-worried about that, but vertical lines between them could
further indicate their lack of correlation.

Yes, that would indeed help. Good call.
 

MestreLion

unread,
Apr 19, 2012, 11:40:11 PM4/19/12
to endgame-sin...@googlegroups.com
Great ideas about how to display the locations. But... is it possible to keep the day/night senoidal thing, preferably with the same (or similar) image? I think that it looks perfect, and also improves gameplay. It is currently by far the most (or only) visually appealing thing in the game

Phil Bordelon

unread,
Apr 20, 2012, 3:09:45 AM4/20/12
to endgame-sin...@googlegroups.com
On 04/19/2012 10:40 PM, MestreLion wrote:
> Great ideas about how to display the locations. But... is it possible to
> keep the day/night senoidal thing, preferably with the same (or similar)
> image? I think that it looks perfect, and also improves gameplay. It is
> currently by far the most (or only) visually appealing thing in the game

Definitely not with the same image. That said, it would be entirely
possible to calculate the day/night status of each of the continents,
even if they are displayed "skewed" from the original cylindrical
projection. The parts of the continent that are in daylight can be
solid, and the parts that are in night can be outline.

That said, I can tell you right now that I have zero interest in working on
that, though. It's a bunch of complex math for not a whole hell of a lot of
payout. Of course, "we" (the core devs) didn't write the original D/N code
either; that was helpfully contributed by others. Perhaps someone would
step up to the plate again :)

P

Reply all
Reply to author
Forward
0 new messages