Monday, October 12, 2009

User Interfaces Are 90% of a Program

MTG Forge has progressed from being "merely ok" to "totally fantastic". When I started MTG Forge from scratch I was very nervous and questions like "How good can you write a user interface?" and "Exactly which cards can and cannot be supported?" and "How good with the AI be?" haunted my mind. It is really tough to convince yourself that it will be ok and to start the project anyways.

In the beginning MTG Forge didn't use any card pictures, it only showed colored boxes with the cards name and the mana cost. Then I figured out that I could show the card picture in the panel on the right and later someone figured out how to resize the picture and show it for cards in play.

In the beginning I really wanted to resize the card picture and put them "in play" or on the battlefield but I didn't know how to rotate a card picture 90 degrees. Someone sent me come code which rotated the card picture in ONE LINE. All it takes is one magical line that I couldn't figure out.

At the beginning I received many e-mail complaining about the user interface but after a few changes I stopped hearing about it. From this I learned the first law of programming for the public: "User interfaces are the single most important part of a computer program." The second law is that "Once X is good enough, you will stop hearing complaints about X." MTG Forge's user interface isn't perfect, but it certainly seems "good enough" for most people.

If something is bad you will definitely hear about it. If something is good you might hear about it, lol.


Unknown said...

I completely agree, most comments are always negative and don't give anything constructive. The only thing i would add to make this better is when its the Computers turn, add in an extra step before they go to attack. This way you can play cards before their attack step.
Otherwise a sound game and the best there is out there. Thanks for re-invigorating my interest in the Magic world.

Peter said...

I agree with necessity to add an extra step before attack. It's probably not needed, but example to demonstrate this:
Computer attacks with huge flying creature and while i have a creature with "W: flying until end of turn", I cannot block and get killed.

More on the original topic: Yes, MTGForge interface is good enough. It's not polished from visual side (no eye-candy!), but there are not many problems with it from the usability point of view, and even those are minor.

Anonymous said...

I just recently found your program and I have to say I am absolutely ecstatic about it. You're dead on right with the interface as being the biggest thing people seem to focus on.

It's like an old adage I heard about comic books. "Art will get the first buy, writing keeps em coming back." You've got the content right here, that's for sure, and the art will come along with time. Functionality will be your best guide too, so keep that in mind when thinking GUI. How does this help or hinder the game?

All in all, great stuff so far, and I hope it just keeps going on.


telengard said...

I would agree that User Interfaces are 90% of the *perception* of a program. In no way is it the most difficult part or bulk of the work in some cases.

Anonymous said...

This program is great. It is hands-down superior to every official iteration of MTG. Keep up the good work. This program is a genuine boon for those of us who have always wondered what it feels like to wield a Mox, but are not quite idiotic enough to lay down the three bills required to purchase one.

Anonymous said...


I am new to your blog. I wonder if there is now graphical user interface designer for Java!? I mean.. did you ever program something with Visual Studio 2008? You don't ever have problems with your gui there. You just use the elements in the toolbox and they cover nearly every intention one can have. You can even import new controls and use them by drag&drop as well.

Same thing with the mouse input interface you wrote on your article last week... In VS it just works and you can use one of the mouse-events every element provides to code the behaviour. Nobody would worry about mouse input...

Isn't there anything convenient using Java or the Eclipse editor?? Or is VS just so much better than anything else?

Sorry but I just never had to take care of that minor matters...

billc said...

I totally agree with your post. But that is probably why I continue to read your posts. All good information. With that in mind, I have a question for you and your years of experience.

I am thinking of writing a replacement for MWS. Mostly to scratch my own itch. My plan is to utilize Adobe AIR for the client. However, the communication networking is troubling me. I am not sure the best method for network communication while still providing an easy to install package.

If you were going to do something similar with today's technologies at hand, would you go with a java based approach with Jetty & ActiveMQ, a streamlined web centric approach with Tornado, or just a plain, individual XMPP server.

I am in a constant state of analysis paralysis as I cannot define the best communication. Traditionally I would go for straight HTTP with a web server to eliminate the unnecessary setup for Active MQ. But perhaps I am too concerned with the upfront environment costs.


rising fruition said...

To Anonymous VS user:
I have to admit that I haven't used VS for many years. However, I don't think the mouse events you are talking about (probably click event handlers) are the same as the mouse input interface Forge has developed.
Again, there could be something like that in VS, but since Forge's thing is a example of the State pattern, I would be surprised.

To Bill:
If you know something that will work and understand how to use it, I would suggest you just use it. Even if it doesn't meet all your ultimate requirements. If you encapsulate the use of the communication well enough, you can go in later and change it. In the mean time, you will have something that works.

I know what I'm talking about here. I tend toward analysis paralysis as well and it's a constant struggle to just do the simplest thing that could possibly work. When I can get myself to do it, it's wonderful (and it's getting easier).

In fact, this just occurred to me, you might make your own communication class and let 2 instances of your game (in separate windows) communicate. Yes, you would see both hands, but it would be a start. I just read about someone who programmed Magic in Excel and he put 2 monitors on his computer and put a partition between the monitors so players could only see their hands. Totally minimal. The simplest thing that could possibly work. Genius!

Working software (even minimally working) is valuable. The most grandiose plans that aren't developed: not so much. Make it work, then improve it.

Good luck

billc said...

@rising fruition:

Thanks for the feedback. Did a bit of research last night on Google Talk and I am leaning towards an XMPP approach. I understand JMS quite well, but am truly worried about introducing a huge number of components. You are right about shooting for a simple solution. I want to keep the number of moving parts to a minimum.

rising fruition said...

Forge, something is wrong with your next post. There is nothing there in At least for me. Not even View Source is enabled on my browser.

billc said...

I have no trouble reading the post.

Anonymous said...

@rising fruition:

I do not exactly know what Forge's mouse interface does, but I know MTG-Forge as a programm and it's user interface. And every part of the interface and the interaction with the user could be done using standard events in VS. For example have a look at the events a PictureBox Control provides:

All of MTG-Forges behaviour would be covered by standard-events.

Especially if you haven't seen a recent version (2005/2008) of Visual Studio.. let me tell you.. it's really worth while.

I don't say that, because I am such a experienced programmer... It's just so simple ;-)

rising fruition said...


I think I assumed you were talking about the previous post's InputControl class when you mentioned handling mouse input. Sorry about that.
I looked at the VS link and found many event handlers, like you said.
I didn't learn enough to comment intelligently on VS versus (for example) Delphi, which is what I use. I know VS has lots of good stuff, I just don't know its stuff.

@Bill and Forge:
All I get for the next post is a 1 x 1 pixel GIF. I tried both Firefox 3.5.3 (my default) and IE 7.0. Really strange.
I hope this is not how future posts will show up for me. I really enjoy this blog, and would be completely bummed if I couldn't get it any more.

DennisBergkamp said...

Very strange (no idea what could be going on - stuff is displaying fine for me).

Maybe clear cache and click shift+refresh?

Forge said...

Yes MTG Forge needs a "before opponent attacks" phase. People seem to really respond to this article, so even though I am absolutely horrible with user interfaces, I need to remember how important they are.

This point is especially true when I try to use someone elses user interface. I have no problem using my own user interface, ha.