UI - A Personal Barrier

Hi all,

This is my second post and a more technology oriented one, though I tried putting in a personal touch.


UI
What do I mean by UI (User Interface) anyway (in the context of computer software of course)?
UI is how an application is presented to a human user, meaning:
- How a user sees data?
- How a user interacts with the application?
- What interests a user?
- etc.


Why UI?
As a person that feels deeply about sharing and collaboration, I try making myself as clear and "readable" as possible (not always succeeding).
When I write code, I try giving classes and methods meaningful names so that other developers can easily understand, reuse and maintain the code and application.
That means that for a server side developer, other developers are the primary users of code readability.
Customers, which are the application's end users don't really know or care about code readability - they just want the application to work!

Code readability is just one part of the game, which I kind of learned to master (there is always room for improvement).
Application readability is another part of the game, in which I have a bit of a clue - well, I am a user myself.
Naturally, I started getting more interested in the end user of my code - the application user.

Where does the the application user and I meet?
In the UI pub.


The Barrier
Recently, I have noticed that I have a UI barrier. Not just a temporary one - a big one that existed since a day I don't even remember.
Ever since I was a child, I had difficulty painting or sketching what I had in mind.
My dad told me that way back, when I was about 5 years old, my kinder garden teacher used to complain that I refuse to paint.
I don't remember her complaints, but I do get frustrated that I visualize one thing and sketch something horribly different :( - perhaps I will take some painting/sketching lessons in the future.
This defect follows me whenever I try making something visual - whether it is sketching a map for directions, choosing colors for presentations or developing UI.
I have lied to myself all these years that it is just a liking - I prefer server side development. The reality is that I have a developer's UI block.


The hammer
So, if I ever want to shutter my barrier, develop a start-up with UI or just broaden my knowledge, I would need to learn and use UI.
But what UI technology should I choose?
There are tons: Swing and SWT. GWT and Wicket. Spring MVC, HTML, CSS, JSP, ASP, Javascript, flex, javafx, and the list keeps on going.
All of them can be divided into 2 sections: Desktop and Web:
Desktop applications are applications that exists and installed locally on a person's machine.
Web application are browser based applications.
There are lots of differences between Desktop and Web application (there are also UI technologies that run on both).
Just search for web vs. desktop application and compare.
The big disadvantage of web applications was that they could not be as rich as a desktop application.
Well, this disadvantage belongs to the past. Just look at Gmail, Google Docs or Google Calendar - they are all very rich Web applications.

OK, so I chose to learn web UI development instead of desktop UI development.

Though this is the first time I'm writing about it, I did had some runs with desktop (Swing and SWT) and web (javascript& html) UI development - all failed miserably.

When I saw GWT(Google Web Toolkit) a few months ago, I thought: "Here is the hammer for my barrier".
GWT is a Web UI technology that is targeted to Java geeks like me.
It is an abstraction over the Web javascript language using the Java language and it gives an easy access to the server.
There were other technology rivals to GWT, like wicket.
Finally, I chose GWT, because no Web UI technology provided me with a 3 minute "hello world" web application that can be easily deployed on a server (Google app engine) and provide an easy client server interaction.


Raising the hammer
So I started using GWT and the first demo application is a Notes application.
The application should display users' notes in a table.
A user should be able to add/delete/edit/search notes.
Because my main goal was to learn UI development, the server just produces several hard coded notes and the UI should present them - for starters.


Failing miserably
Here is the first hammer strike.
It took me hours and still a long way from breaking the barrier.
How do I put the lines in the table?
How do I center the table?
How do I make the table stretch on all the screen?
How do I add column headers?

Well, now you know how my barrier looks like.
I visualized one thing and implemented a whole different one...


Purpose?

• The trouble of many - half of the consolation.
• A cry for help, by a UI developer, to the Web UI technology world. How come that there is no simple way for writing Web UI? Thanks to GWT, the client-server interaction is smooth and thanks to Google's app engine, the deployment is easy, but - Why is my UI still looks like $%^&?
• A kind of a promotion to GWT.
• A kind of a demotion to GWT - I expected something more easy.
• Finally, because the only followers I have are my friends and family, this is an opportunity to share what's keeping me busy.
  

What's next? Retrospective!
I'll try to understand if it's me or GWT? (Why GWT doesn't have a Style class?) As Sting said: it's probably me :(
If it's me, I'll probably have the same problem with other Web UI technologies such as Wicket, so I'll probably stick with GWT.
I'll try to solve the problems I had above and continue broadening the application.
Perhaps choose a different application to develop? Something more useful. There are plenty of "kind of Notes" applications (who said Wave? :)
Feel free to suggest new ideas.
As soon as I start feeling more comfortable with Web UI, I'll share my insights.


This was a long one,
Hope you enjoyed,
Alik.