Re: Make apps prettier!
 

Finger-friendlines is good but it's not always needed, for we have the advantage of the stylus. We lose all the advantages of the high dpi if we code finger friendliness in all apps. GNUmeric for example and gFTP are being hindered by big controls. Anyway it's impossible to use them without a stylus, (try to use quicksheet on an OMNIA HD capacitive screen and you'll see that you can't hit the right cell, and the lack of scrollbars adds one click to every edit). Anyway, if I want to edit my website while on the N900 I am willing to pull the stylus out for sake of speed. I have the same resolution on my eee and I say you can do about anything.

Why just not create another website with the same database connection and more portable design? Why do we need an app for everything? Handhelds should be the first that adopt the remote computing idea. It trades connection speed for processing power, I know and both are limited and energy-expensive on a handheld, but I'd rather outsource the computing.
________
Children Zoloft

Re: Make apps prettier!
 

Not a good idea- i'm sure the N900 is the last maemo/meego device featuring a resistive screen. And it starts fall this year...

Re: Make apps prettier!
 

Isn't it possible to use a stylus with a capacitative screen? I suppose it just needs to be from a conductive material...

Re: Make apps prettier!
 

the problem is, that capacitive screens aren't as accurate as resistive ones..

Re: Make apps prettier!
 

Well feel free to contact me if you need GUI designs for your applications.
I work as a freelancer.

Re: Make apps prettier!
 

Indeed!

It really depends on what the device is designed for.

If it is something like the n900 then a resistor-type screen makes sense - the n900 is more for general use, some of the applications need more accuracy (e.g. vncviewer) - you really need a stylus to get the most out of it.

If you are talking about something like iPhone then a capacitor-type screen makes sense - the iPhone is more like an entertainment device and needs to be more accessable.

E.g. You can use finger, stump or body-part not under restraints (e.g. use nose when you are secured in strait jacket shouting "Steve Jobs is the messiah all hail the iPhone!")

Re: Make apps prettier!
 

Is that really the case? Accuracy?
I know that the popular implementation of capacitive screens needs larger surface contact area to register the input, but less accuracy..?

Re: Make apps prettier!
 

I'm going way off topic, but we're there already, so here goes.

I think the popular implementations of both technologies reach sufficient and comparable accuracies from the hardware.

The question then becomes, how to make use of the information provided by the input device. This in my opinion is what can make or break the illusion of the accuracy of the input, and the "smartness" of the device.

One thing I dislike about the N900 touch screen input processing, is that the input given by the touch sensor is taken literally by the OS, as it would be if I was using a mouse.

E.g. There's one small link in a middle of a web page I'm viewing, and it's the only clickable item on the screen. I try to click it with my thumb, and in the process, cover it from my view. What happens, is that I miss by 2 pixels, because the thing covered by my thumb and I cannot see it. Now, the OS knows I clicked, and makes the click sound. It just isn't smart enough to know I tried to click on the link 2 pixels away, making both it and me look stupid.

In some way, this developer lazyness maybe caused by the resistive touchscreen technology, as it gives an "exact" point which was touched. Capacitive, OTOH, senses the whole touched area (and a bit more), and it's up to the OS driver developer to find the center of that area (or if there were actually more than one area, meaning multitouch). While doing that, it's a natural thing to check if there was anything clickable inside the *area* that was touched and activate that, making it act closer to the "do what I think" ideal.

Given that UI elements are far enough from each other, there's no reason why a "larger touch area" could not be implemented and properly working on a resistive screen. Someone's just been slacking off.

Re: Make apps prettier!
 

Yeah ive always like the look of the iphone apps, but i hate apple. Wonder if we will ever see nice looking GUIs on our N900s

Re: Make apps prettier!
 

I think that the capacitive craze is fashion and just that. I think that the very small amount of extra pressure needed in resistive screens is nothing to compensate the lost accuracy, and the need to lift your finger away from the screen when multitapping (not to mention ability to draw, handwrite or otherwise keep memos on the screen). All the reviews exaggerate this with statements like "swiping, or in fact push and drag". It is true resistive screens have come a long way, it was like that the old days, and some of them even had a considerable distance between the film and the lcd making taps less accurate, but most of the non geeks I know, can't distinguish between capacitive and resistive screens by the touch, and I have to tell them the fingernail trick.
________
EmberReigns cam

Re: Make apps prettier!
 

I think juise- has some good points. The people who program for capacitive screens have to be much more concerned about the user's intent. Apple has done an excellent job here (no pun intended). Rarely does my iPod touch respond, or not respond, unpredictabley. But on my n900 for instance, when I'm scrolling through lists, even though it doesn't activate, the row I put the stylus on will temporarily highlight as if it means to activate. That's lazyness, and it gives my eyeballs and thus my brain a quick jolt of fear that it is going to activate. Uncool.

Re: Make apps prettier!
 

See I read you here - about creating a mobile website - but sadly "mobile websites" means iPhone based websites these days and they only work on browsers which have the iPhone header in it.

Also sometimes even on a normal mobile website the design such. Like for my Bank of America website (normal mobile site - not the iPhone site) - the button is so close to another link you invariably hit the link when trying to click the biutton ... and there are at least 4 screens to go thru before you get to the accounts page ... poor design.

But then of course if the same company designs an app - maybe that will be pooorly designed too.

What is ideal for say my train company to implement is provide the data via an API or something - or XML so that even 3rd party developers can write apps for such sites. Cause its is not always feasible to ask each company to design a mobile applivcation for each device.

Re: Make apps prettier!
 

For a thread about UI and pretty apps, the dense text/images ratio here is really high. :p

I suspect most devs would welcome help from a designer. It seems that there are a lot more coders with a FOSS mindset than artists; big open source projects are so frequently fugly yet functional...

Re: Make apps prettier!
 

Actually I think it was a very good comparison. One clearly had a better usage of the desktop space than the other. Both seems to be graphically "pretty" but one is using the screen far more efficiently.

Yes, we have a good clock on Maemo too, so the thread starter would probably use the one you linked to, if only he knew about it. But that would have made a comparison pointless, since they're much the same and he wanted to display difference between an appealing application and one that doesn't appeal to him. ;)

As to which one is prettier, that is a matter of preference. Sadly, I think the enemy one is cleaner. But doesn't N900 the flip clock have skinning?

Re: Make apps prettier!
 

Yeah, that guy just disappeared. Too bad, he was really good, and his Italian-to-English was hilarious.

Re: Make apps prettier!
 

Engineer graphics that's what you're seeing.
Companies hire UI designers to design the UI and graphics desingers to draw the UI.
Homebrew app doesnt' have this luxury and budget.

Re: Make apps prettier!
 

But why do nearly all iPhone apps look good? Are all those 100000 apps made by software companies?

Re: Make apps prettier!
 

Surely not, but I expect a lot of those 100000 apps look pretty bad too. Most of the good looking iPhone apps are probably made by professionals.

Re: Make apps prettier!
 

It really depends. Plenty of them use the standard UI with custom icons. Others don't use any of the iPhone OS UI. Do you have an iPhone OS device? If so, download the NASA app. Very generic, but it looks decent because the default widget set looks decent, and acts decently. But compared to many other apps in the repository, it could be argued that it's ugly.

As far as I know, all versions of Maemo support GTK theming and custom app icons. What all versions of Maemo don't support, is OpenGL ES. That's the finishing touch for all the eye candy, but Maemo 5 uses it differently than iPhone OS, and I don't think it's themeable. If it were, you might see more of what you're looking for. At the moment, too much is left to the developer, and that's good and bad. But the default Maemo 5 UI could certainly be blingier.

But my opinion is that Apple wasn't, isn't and won't be going for bling any time soon. Ever. They have one goal in mind: Make sure the user is confident that things are happening as expected at all times. There's rarely a WTF moment. They use transparency and animated transitions to help maintain user confidence and to lessen frustration. The UI isn't moving at machine speed, it's moving at human speed. It makes things easier and less intimidating.

That said, there are those of us that aren't intimidated by technology and thus are more immune to UI prettiness. We're not the norm, but you knew that.

Re: Make apps prettier!
 

I saw the post saying there's no iPhone apps with ugly interface and I thought I'd google a bit to disprove that.... surprisingly, I couldn't find any articles talking about any specific iPhone apps with ugly interface (!).

Instead, I've found this listing of 30 iPhone apps w/ 'sexy' interfaces:

http://mac.appstorm.net/roundups/iph...xy-interfaces/

I thought some of them are quite interesting and relevant to this thread.

http://mac.appstorm.net/wp-content/u...weightbot1.png

http://mac.appstorm.net/wp-content/u...convertbot.png

http://mac.appstorm.net/wp-content/u...7/measures.png

Re: Make apps prettier!
 

No. Can't you see? Engineers have N900s. Web designers have Ipodphones. That is why the powerful software is here, while the useless but pretty software is there.

Re: Make apps prettier!
 

If someone artistic has a hankering to help, i'd welcome a better design for gweled. Here are the current pixmaps:

Attachment 8521

You can make directly equivalent images that i can make available as alternative skins or create a completely new layout that incorporates the same elements. If you do the latter, please consider both portrait and landscape layouts. The actual board size could actually be increased in the latter case.

Re: Make apps prettier!
 

I thik one of the problems with some open source projects is that developers are the ones leading the project, sometimes they are only ones on the project, with no experience or training in design.

Drupal had this problem for a long time, a lot of the default themes were terrible because Drupal was/is not designer friendly.

It's not as simple as writing some code or even making some pretty pictures, you can't expect programmers to know everything a designer knows, that takes years of learning and hard work.

Anyway, I'm a web designer, I own a N900, I'd be more then happy to collaborate with someone some a project.

Send me a message.

Re: Make apps prettier!
 

The 'problem' is the motivations and incentives in open source model.

AFAIK opensource projects are not created to appeal to as big of an audience as possible, as in commercial projects. That should give an idea of how things are generally structured and what elements may be left out/de-prioritized during the development.

Re: Make apps prettier!
 

I'm a designer and I'd be willing to help out. I have a lot of work on at the moment (uni), but if I have time, I will help any developers out, and will be able to help more next month when uni is over!

Any developers feel free to PM me, and I will see if I can help. :)

Re: Make apps prettier!
 

I would have to say i do agree with the subject, i feel that the good coding and a sexy gui go hand in hand. I'd be happy to help any programmer with my skills, PM me ;)

Re: Make apps prettier!
 

I vote for flip clock, just think the red needs to go is all and the light grey darker a few shades ;)

Re: Make apps prettier!
 

I kind of agree with the OP, although I'm reluctant to really point it out. I think its incredible enough to have such elaborate and powerful apps in the first place free of charge, completely done out of other users' free time.

There are, however some general pointers I could suggest that app designers look at when getting to the point of checking the UI for their app (:P):

1) Always visible scrollbar on the right of the screen is a no-no. It immediately gives the appearance a cluttered feel and besides usually the scrollbars can't be manipulated by finger, but need the stylus. Why do we have a scroll bar if we can pan the page with touch-input? I do realise that at times it poses a problem to have both text "painting" and page scrolling in the same app at the same time, but I think the scrollbar should be avoided until the bitter end.

2) Prefer using elements that can be used with your finger. This will naturally result in the following: the appearance will "open up" as it loses its clutteredness as stuff can't be stuffed into the same view. You will have to make elements larger, thus clarifying the whole look. It will also force you to hide some of the functions to other pages.

3) Relating to having too much stuff on the screen, make the text in the app bigger than 10pt and use a font more consistent with the rest of the UI. For example italics tend to strike me most as looking very out-of-place. Same goes for insisting on a certain colour for a text. Think about support for various themes.

4) Never (ever!) hide the "X" and/or "minimize" keys. Not everyone knows of "ctrl + backspace"

5) I know you want to have all the things the app can do right there on the first page of "Settings". Consider evening out the less used features behind an "Advanced" tab or button. This way the user was warned of the jungle of options coming his way.

This is just a few, but I think these ae maybe the most common "flaws" I've stumbled upon. :) Like I said, really loving the App scene in Maemo, but making your app functional and looking good would be an ambitious yet justified combination.

If I had to name one "example app" that's native to Maemo for how it should turn out, I would name the Calendar and Modest. The calendar has a lot of features packed into it, but still it looks good and you can get the most of its features, even if it all isn't seen at a glance. There are numerous things I would change with how the calendar works in the first place, but graphical design is IMO good.

Modest is my second picking as an example app because it doesn't really have anything fancy going for it, but its dead-consistent with the rest of the UI and pulls off showing your e-mails, e-mail settings, postboxes etc. without it feeling like a techie's app. I think Claws, Nokia Messaging/Nokia Mail (whatever its truly called) and numerous other e-mail clients for mobiles are really too cluttered to ever compete with Modest.

Does this give anyone a more "concrete" idea about what the UIs should look like? :)

Re: Make apps prettier!
 

Just pick an app that you think needs a better UI and re-think the navigation and layout, then use a mock-up tool (e.g. http://www.balsamiq.com/) to create a mock-up and create a new thread and discuss your ideas with the developers.

The developers will then tell you about some special cases and features that you have not thought about in your mock-up. Fix your mock-up or convince the developer that his/her idea of this feature is not optimal.

There are lots of small paper-cuts that can easily be fixed. For example, the fabulous "Desktop Command Execution Widget" has a preferences dialog. In this, there is a picker button "Update interval:" with different choices (5 Minutes, 30 Minutes, etc..). The first choice is "0" and the label below the button says "'0' disables periodic updating". That's just plain wrong - just change the label of the choice from "0" to "Disabled", and get rid of the label. It's even small things like this that you should find and tell the developers about.

Edit: Screenshot:

http://khan.thpinfo.com/~thp/images/...ion-ux-bug.png

Re: Make apps prettier!
 

I think your project is in the clear for not being too "engineery". Nice colours, some graphical effect to the interface but nothing over the top. Sound, music... I think everything comes together well in Gweled. :)

Re: Make apps prettier!
 

That UI just looks cumbersome and hard to use.

I can see value in the feel this gives for quickly accessing units and seeing only what you care about. I've filed an enhancement request on this for Gonvert.
https://bugs.maemo.org/show_bug.cgi?id=9774

I can also see value in the current Gonvert UI and am unsure how I want to handle the two different styles of UI.

Re: Make apps prettier!
 

The shade color is adjustable. Simply slide from top to buttom, it should "flip" to the config page and you can change the mood lighting :)

Re: Make apps prettier!
 

Flipclock is nice example. Gpodder is maybe even better example of good design and functions great. Very clean UI with big buttons, pictures of the podcasts, portrait and unique download bar when the device is thinkering.

Re: Make apps prettier!
 

I certainly dislike the i-phone's two way switch alternative to checkbox that sadly made it's way to the harmattan's ui. The checkbox is a super intuitive way of an on-off switch, language and color independent.
________
Novana Residence Condominium Pattaya

Re: Make apps prettier!
 

You're right about the language independency. I don't no why, but people like to wipe over their displays. And to be honest, me too. On my old nokia 5800 i replaced phone torch by bright light touch. Phone torch has more functions, but i only need the light on/off feature and bright light is more fun to use...

http://3.bp.blogspot.com/_I4D-2UIKgX...400/sf8adu.jpg

http://gishatech.com/wp-content/uplo.../scr000038.jpg

Re: Make apps prettier!
 

Count me in to help designing. I am not a coder, but a fan.

Re: Make apps prettier!
 

I see two ideas on how to do this as a greater process/project:

• One app/widget every week - discussion focused on making it very usable
• One "app part" every week - Preferences dialog, about dialog, app menus, main view, lists, etc..

What about joining forces and picking a new app/widget every week (that gets proposed by someone in this thread here) and then we all work together and post mock-ups, issues, etc.. and come up with some improvement suggestions that we then communicate to the developer (of course, if possible we should involve the developer during the week too)?

We would obviously need "plain end-users" (who can use the app and tell us what is not clear to them), "graphic designers" (who can do replacement icons, application icons or logos, etc..).

This way, every app gets enough time and thought (~1 week) that can be implemented by the developer {him,her}self or as patches by developers from this thread. Is this something we want to do? Maybe we should create a separate thread in the "Design" forum for each week with the prefix "[UX-WEEK]" or something and the first post is always updated to contain a summary of the current problems, suggestions, mock-ups, etc..?

Some ideas on how the weeks could look like for the "app part" variant of this idea:

• Preferences dialog - We take screenshots of preferences dialogs for our favourite applications, collect "best practices" and compile a list of changes for every app to make the preferences dialogs usable and predictable through the whole Maemo app space
• About dialog - Generate a list of details that every about dialog should have (Bugtracker link, donate link, version number, author, license, website, etc..) and communicate this to the developers of our favourite apps
• Icons - Look for icon usage inside applications and try to make the developers use built-in icons where possible and create icons that fit the built-in style for apps that need special icons
• Lists - Make sure that lists have primary/secondary text, with the correct styling; make sure the list is searchable via keyboard and (where applicable) has a longpress context menu
• Controls - Make sure that the correct control widget is used for a given value (picker button for "one out of a set", a slider for numeric values, no comboboxes at all, etc..) - also, the buttons should have the correct styling (thumb or finger size, not the "flat-looking" default look)

The end result of such a "focus week" could be a list of best practices for every part (with screenshots of good and bad examples), a list of affected applications (with the developers contacted and supplied with enough information to implement the ideas - be it patches or artwork, mockups, etc..).

Please also note that UX is not about eye candy only, but mostly about behaviour and what the information is that is displayed (it does not matter if it has iTunes-style reflections and shadows and everything if you have to do some weird gestures to interact with it). Also, colorful icons are nice, but the Maemo 5 UI is more about monochrome white-on-dark "flat" icons without much detail and more focus on the silhouette.

Re: Make apps prettier!
 

After some thanks and no comments, I just went ahead and created a poll for which topic we want to work on in the first week - let's see if this takes off! Please vote for your favourite topic and then we can start the first week on Monday and see if and how it works :)

http://talk.maemo.org/showthread.php?t=49686

Re: Make apps prettier!
 

The vote is closed now (after just one day, but a trial run should be done as early as possible, and it's Sunday already).

This means that we are concentrating on preferences dialogs this week. Please post screenshots of the preferences dialogs of all apps and widgets you have installed and describe the behaviour if something is unclear. Also show the UI to your friends and tell them to interact with it and note any questions or errors that were introduced by bad UI design. Also note things and settings there were well implemented and work well.

Based on this, we can then work on improvement concepts. Please also contact the developers of affected applications so they can chime in in the discussion :)

Re: Make apps prettier!
 

I've been offering to help design for months now, but no one seems too interested. I'm really glad to see that changing. I'm down to help!!