maemo.org - Talk - Ideas to improve maemo.org design

maemo.org - Talk (https://talk.maemo.org/index.php)

- General (https://talk.maemo.org/forumdisplay.php?f=7)

- - Ideas to improve maemo.org design (https://talk.maemo.org/showthread.php?t=22475)

Ideas to improve maemo.org design

Please help improving the maemo.org website. We are specifically looking now for ideas to redesign the layout (graphical elements, styles, page designs...)

Ideas about improving the web structure and content are also welcome. And whatever else you think the people in charge of pushing this redesign should take into account.

If you want to make other types of suggestions about the website please use the search to see if there is already a discussion going on. Examples that come to mind are server performance, Extras, bugzilla...

Thank you!

Re: Ideas to improve maemo.org design

Quote:

Originally Posted by wazd (Post 209554)

got the task ;)

???

What do you mean?

Re: Ideas to improve maemo.org design

Quote:

Originally Posted by qgil (Post 209609)

???

What do you mean?

I mean I'll be glad to help :)

Re: Ideas to improve maemo.org design

How about further categories for games? there are a lot and it would make it easier to find. RPG/FPS/Puzzle/Action etc

Re: Ideas to improve maemo.org design

maemo.org is not very usable on the NIT. It doesn't detect if a user is using a NIT and act on that; whereas many websites start doing this for the iPhone. If you want to start something similar for the NIT you have to give the right example. I propose you investigate this possibility (I haven't, cannot).

Another issue I have with maemo.org is the mess of the Wiki. It isn't clear right away the data is mostly for the N770. I suggest this Wiki is renamed to N770 Wiki (or 'old wiki') and removed from the main page, to a more obscure place.

The website is also very text-based. While developers are often text-based people (doing kernel development, database development, using CLI), most users aren't. You only want real information being text. Information which keeps reoccuring you want to use pictures of because this way it is saved easier in the human brain. Remember most people are visual people, they don't want to translate text to picture. If you want to attract these people to the maemo.org platform and have them use and/or contribute you need to make maemo.org attractive to them. Take an example of Canola, iPhone, MythTH. IMO it'd be great to extend this to maemo.org (maybe with 2 'versions' of the site but how to do this technically is an interesting obstacle). Therefore, I suggest to use more icons on the webpage. SVG preferably, so they can be easily adjusted and/or reused later. Colour neutral or in harmony with the new maemo logo. I love the new maemo logo btw, definetely has a Nokia feeling. Consider to hire someone to make these icons/pictures.

Some examples & suggestions:

garage.maemo.org -> A garage; this will be the synonym of garage.maemo.org
The pearl -> Simple; a pearl :-) I'm a former player of MTG and I immediately have a so-called Mox Pearl in mind.
Bugzilla -> Squashed bug
Roadmap -> A map, with a road on it.
Lists -> No clue, I'm not going to click on it, but I can assure you the word 'lists' means so much. This is incredibly vague!
Repositories -> CD, or something which resembles 'software' otherwise. Or, even better: the 'Application' icon!! Although this icon also reminds me a bit about a SDK (see hereunder).
Tutorials/Documentation -> these 2 overlap. Book, but the icons should be destinctive of each other. I don't know!
IRC -> Cloud with IRC in it, or a balloon with IRC in it, or simply a balloon (who cares about the protocol used to chat w/each other that can be made clear on the actual page). Rename to 'chat'.
Community -> Several heads of people, in a cirlce, or together, like the 'contacts' icon on OS2008 2nd from left upper corner. Although might conflict with 'IRC'.
SDK -> SB2 icon, or a box with blocks.

Speaking of usability. I'd love to see in profiles a way where people are able to express their experience of a piece of software of the NIT (official & 3rd party). Version of software must be included in the experience though, and authors of the software are easily able to read these experiences in a database. I've worked this out a little in a post of mine elsewhere on this board:

Quote:

Originally Posted by allnameswereout (Post 209864)

It surely is useful (not boring) in Amsterdam. My intention in Amsterdam wasn't to use it as a toy, or for fun. It was meant to be used as an aid instead of using maps or asking people around (luckily people in Amsterdam are nice folks). There are all kind of little and small pearls happening in Amsterdam. They're announced in the paper, and an address is listed. Instead of using a map, I'd use a GPS system instead. Faster and easier. Unfortunately, see the earlier message...

Aesthetically I find Maemo-Mapper not nice. But that is overcomable.

Next I get all kind of problems: cannot get fix easily, the maps aren't preloaded, I cannot find the POI, and the interface has all kind of technical terms I just don't want to know about (yet). I've come to the conclusion Maemo-Mapper is more for power users while I want an application which Just Works (tm). Usability-wise it isn't there yet, at least not for me. Usability is important for me, especially on a device like the NIT. I believe the Maemo-Mapper guys have a lot to learn in this regard. In the meantime I'll stick with what works for me. Out of box experience!!

It all starts when I open the program for the first time. A popup tells me it appears I run the software for the first time, and asks me to read the Help file. That isn't promising. Probably means its complex software. Next I get a configuration popup with 6 tabs. Intimidating. The first one asks me to select my GPS. Instead, the program should have known my N810 has a GPS and by default select this because most people with a N810 want it this way. Because the application doesn't do this I start to distrust its default settings. I check if I have /dev/pgps and yes, I do, so I selected this. The rest I leave intact although I'd like to use Wayfinder's POI database. Then I downloaded a list of repositories. It now defaults to Yahoo. I don't know if I want that. I want the best one available for my country (The Netherlands), no questions asked. I have 8 choices instead. Now I select Google Street because I know maps.google.com and Google Earth a bit and know they are of good quality (although I'm not a fan of Google's privacy policies). Now I see Europe, and its searching for a GPS receiver. I have A-GPS enabled. The icon of the GPS in systray appears and disappears, while the application says searching for GPS receiver. There is a thunderstorm and I'm going to quit using the NIT, leaving the device on. Maybe it has a fix in an hour or so... oh wait, it now gets an error it cannot connect to the GPS server. Maybe if I start Wayfinder first...? Yes, now its establishing GPS fix.

Interestingly, I now notice /usr/sbin/gpsd is running but it says /usr/sbin/gpsd -n -N -F /tmp/.gpsd_ctrl_sock /dev/pgp while Maemo-Mapper uses /dev/pgps. I don't even have a /dev/pgp. My /dev/pgps is a symlink to /dev/pts/0. Something seems very wrong here, but I know the gpsd was started by Wayfinder... sigh :)

I made a symlink from /dev/pgps to /dev/pgp just to be sure. I also read the manual and made it set to BlueTooth with no furthermore settings. This is totally illogic to me and a prime example of the usability issues this program has!

Just to make sure, I don't know who the Maemo-Mapper authors are, and I certainly don't mean to offend anyone. All I do is express myself in honesty. I do suggest in a more broad sense some kind of way to gather user experiences. I've once read a report about this which was very good. A professor would have GNOME and KDE installed on a standard, user-friendly end-user system. Now, someone would describe their first name, their past user experiences, their employment, their hobbies, and what they use a computer normally for. Next, the user starts to use the DE and writes down on the moment their experience. This includes a lot of subjective aspects like their feelings, their character as person, and so on. Afterwards one is able to read, besides subjectiveness, their experience and you can replay it. You're able to empathize with the user, and you can follow their logic based on the (albeit still limited) facts you know about the user. You can then translate this into a usability report, and feedback to the software. This paper was published a few years ago, and featured on Slashdot.org & OSnews.com. I'd love to see these principles gathered in a project; perhaps similar or contributing to openusability.org. Perhaps there already is such a thing for maemo, but what I also mean is besides a Bugzilla a database which includes usability related issues or even simply experiences. If there are sets of guidelines for such database the raw data can be easier parsed than say a discussion thread.

Re: Ideas to improve maemo.org design

Quote:

Originally Posted by allnameswereout (Post 209927)

UA detection is a bad plan. The way it should be done is to design the website so it works well on a variety of screen and CPU sizes.

This isn't easy to do, but the end result will be a faster, cleaner, easier website for everybody.

UA detection just leads to more brokenness for both groups.

Anyway, I've got some ideas for this, but they'll need to wait until I get back to a real computer (end of August). I may start with a wiki style to mock some stuff up.

Get ready, X-Fade. ;)

/me sharpens his Official maemo.org Team Sharpened Poking Stick.

Re: Ideas to improve maemo.org design

Quote:

Originally Posted by GeneralAntilles (Post 209930)

True, but I've seen both. Resolution detection was popular back in the end of the 90s already, although also manual. UA detection is an easy hack, and already widely used here and there. The problem is rather: lack of support for less popular devices. Again, if Nokia wishes to set a trend here, they should give the right example. Resolution is detected from the initial HTTP request. It isn't much more difficult than UA detection. No, my issue is rather: do you want to detect this automatically or do you want to use a default with an easy button to switch? One could use remote desktop on a NIT, and then neither the UA string nor the resolution is of much use. I say: lets assume people browse maemo.org from the NIT unless [...] (e.g. they are not using MicroB) and have an easy button to switch to 'normal' mode. There are all kind of 'lists' available of websites which support iPhone; its quite hilarious to me this is necessary. Problem is: regarding manual mode switch, there is no standard. Another option might be to use both. Another solution might be to use both, with UA detection as a safe net for the resolution detection. You can be reasonably sure someone using browser MicroB with resolution 800x480 with OS2008 as OS is using either the NIT, or a clone of the NIT. But do you want to serve people who are using resolution 800x480 with Safari? Or a browser which provides a different experience? How do you know for sure how much of the screen is used for the browser? If I have a widescreen with 1680x1024, I might still have a Windows Sidebar on. That is the issue I have with resolution detection; and I had this back in the 90s too. Not everyone browses full screen. This issue might be small, but its definetely worth taking into account IMO.

Does X-Fade read this thread? Maybe in a chat or Wiki it is easier to brainstorm than on a forum. After chat, summary/conclusions can then be written on forum.

Re: Ideas to improve maemo.org design

Quote:

Originally Posted by allnameswereout (Post 209931)

True, but I've seen both.

You're entirely missing the point. UA detection, resolution detection, whatever detection you want, they're all pointless. Well-designed CSS eliminates the need for stupid device-specific designs. A well put-together site can fit in 200 pixels as well as it can in 1920 pixels.

Having a separate design for tablets is a bad idea, because it doubles the workload and pretty much always means the tablet-design will always be behind the desktop one. Besides, we have desktop-quality browsing on the tablets, why not make use of it?

Quote:

Originally Posted by allnameswereout (Post 209931)

Does X-Fade read this thread? Maybe in a chat or Wiki it is easier to brainstorm than on a forum. After chat, summary/conclusions can then be written on forum.

He does, occasionally, but I wasn't planning on brainstorming here anyway. The wiki page on the subject is the correct place for discussion.

Re: Ideas to improve maemo.org design

You can make simple design that works on 200px. Anything visiually appealing will not work on both 1920 and 200. On 800 maybe, but not 200.

EDIT: I'm planning to throw some mockups of my ideas if the time permits.

Re: Ideas to improve maemo.org design

Quote:

Originally Posted by GeneralAntilles (Post 209937)

You're entirely missing the point. UA detection, resolution detection, whatever detection you want, they're all pointless. Well-designed CSS eliminates the need for stupid device-specific designs.

Because of standard issues with browsers (IE6 <= being the culprit) CSS was not a good solution for this purpose. I don't know how this is nowadays, maybe the situation is changed with IE7 replacing IE6.

Quote:

A well put-together site can fit in 200 pixels as well as it can in 1920 pixels.

Well put-together, yes. Most websites aren't. maemo.org can set the right example, it seems we agree on that.

Quote:

Having a separate design for tablets is a bad idea, because it doubles the workload and pretty much always means the tablet-design will always be behind the desktop one.

Untrue; this was true when everyone still used static content, and even back then webmasters had scripts to update all their static versions. Nowadays we have all the data in databases like MySQL using PHP to grab the data dynamically. The data is the same for the user, with some minor changes here and there. The design isn't dynamic; the design doesn't need to be changed after its programmed. The design for both versions is static. Heck, even WAP websites have done this right from the beginning.

Quote:

Besides, we have desktop-quality browsing on the tablets, why not make use of it?

Ehm. Don't make me laugh... desktop quality? Using Opera on a 1680x1024 resolution on a Intel Core 2 Duo with DSL and MDI (or for Firefox, tabs) is definitely a different user experience than using MicroB on a NIT with OMAP2 processor on 800x480 over WiFi without MDI or tabs.

MicroB doesn't support many extensions Firefox has. MicroB doesn't have XUL. MicroB doesn't have the same kind of integration Firefox has, and MicroB isn't used for the same tasks as Firefox running on a normal desktop either! If one is using the NIT, one uses this device for different purposes than a desktop browser, and the experience is also different; which is fine, but a webmaster has to take this (preferred) different experience into account when designing a web page. You don't want 10 flash videos playing on your NIT when you visit maemo.org; and rightfully so. That is why there are different designs for different devices. Please, lets not be overconfident that the is or can be a replacement for a desktop (or MicroB for Firefox or Opera). They both have their place, their niche, and serve different purposes.

Some other examples besides 10 flash banners with some woman singing about her lover:

1) Pictures. You want to have your pictures slightly less quality than the real version so they are faster downloaded, and perhaps also smaller. Some proxies take care of this. If you look on websites for mobile browsers you'll notice a difference in advertising because these encumber the user experience in such way that users stay away from the website.
2) You want to use less text and more pictures. As the saying goes: a picture says a thousand words.
3) Java and other things which slow down the browser (JS) should not load by default; only by user request. Same for Flash. NoScript for MicroB would be ideal.
4) As less distraction as possible; a user on a mobile device has a specific goal to use his device because 1) less resources; the user experience is more limited 2) the user is probably outdoor with limited time 3) the user comes on the website for a pre-defined goal, a task to be done; not to just wander around; therefore the user doesn't need suggestions.
5) Pop-ups, open new window on click, using HTTPS where it isn't necessary. Don't...

Re: Ideas to improve maemo.org design

As a community you can decide on a logo, but I have doubts if things like usability, graphic design and marketing can be done this way. It seems to me that OS projects that are succesful in those areas, like Firefox depend on paid user-interaction designers, graphic artists and writers. Shouldn't the focus be more on that?

Re: Ideas to improve maemo.org design

Yes, that is why I proposed that, but I don't know if X-Fade is a graphics artist, nor if Nokia (or their open source / Linux dept.) wants this; its their project & money. One can argue that due to the open source nature, Nokia expects the community to stand up for a feature like this.

Some artists were hired by corporations like Novell to design artwork for SUSE. Ofcourse, some of the artwork made remains the property of the corporation who hired the artist (while some artwork is now included in e.g. KDE). Perhaps the author of the maemo logo is able to design more for the website using the style he/she used for the logo to design more artwork? He/she can do so on contract. I don't know the winner of the contest, BTW.

Re: Ideas to improve maemo.org design

I have experience both on web development in volunteering/community and professional/corporate contexts. You can get really bad/boring results (or no results at all) in both contexts, with budgets ranging from zero to many zeros.

In this case it would be good to get wide community feedback on problems detected and ways to solve them and then sign a deal with a professional team to go through them. Working openly but having something like a single contact with a customer role to deal with when it comes to make decision and approve stuff. Who? To be defined but needs to be someone (singular or plural) knowing about web development.

I have just asked whether Glauber (designer of the winner maemo.org logo) and the team that was involved in the work at Open Bossa are available to work on this. Nokia has some budget available for this task.

I have added the core ideas discussed here at https://wiki.maemo.org/Talk:Task:Maemo.org_facelift - although I have linked here instead of trying to reflect the debate about optimization for Maemo compatible devices Y/N.

Quote:

Originally Posted by allnameswereout (Post 209927)

In the times of maemo.org under Nokia's responsibility the ida was precisely not to have an optimized version of the website. Was that right, was that wrong - I'm not sure. Still, I think that first of all we need a website that is great and efficient on the desktop, paying attention to those details that make the experience better in Maemo compatible devices e.g. bigger icon-links, larger default fonts, less vertical space taken by top static blocks in the home...

If some optimizations are needed, from a political point of view we probably prefer to approach W3C or similar recommendations on mobile devices, touchscreens, etc, instead of promoting an "Optimized for Maemo" kind of thing bringing to web developers and users reveries from the past and extra work to everybody optimizing your site for every vendor with a browser and some cool devices.

Quote:

Another issue I have with maemo.org is the mess of the Wiki. It isn't clear right away the data is mostly for the N770. I suggest this Wiki is renamed to N770 Wiki (or 'old wiki') and removed from the main page, to a more obscure place.

Are you talking about the new wiki or the one we already moved to an obscure place?

The website is also very text-based. (...) IMO it'd be great to extend this to maemo.org (maybe with 2 'versions' of the site but how to do this technically is an interesting obstacle).[/QUOTE]

Yes, yes and yes. I had commented this already at https://wiki.maemo.org/Talk:Task:Imp...nt_web_content . I think the solution is to have the first and second levels full of all kinds of dynamic and customizable content, graphical information, videos and interactive stuff, and leave the full text dense (but needed) pages on deeper levels where only those looking for them will land.

Quote:

Speaking of usability. I'd love to see in profiles a way where people are able to express their experience of a piece of software of the NIT (official & 3rd party). Version of software must be included in the experience though, and authors of the software are easily able to read these experiences in a database. I've worked this out a little in a post of mine elsewhere on this board:

This idea is too good to be lost in a thread. Can you (or someone) convert it to a maemo.org development task? Just pasting this content in a wiki page could do as a starter.

Thanks for your time and feedback!

Re: Ideas to improve maemo.org design

You need to have synergy and incentive between a team of web designers, the manager, and developers & end users (the latter two for feedback).

My account on maemo.org quit working whereas I signed up for it while on vacation so I forgot the password. I've managed to solve the problem. Also, I had not noticed the new wiki yet. Thanks.

I've made a stub about the usability experiences at https://wiki.maemo.org/Task:Usability_experiences it doesn't contain any proposed solution for the necessary framework required to include the usability experiences yet. Because of the importance of such framework instead of including my suggestions on this subject I rather see discussion about it first.

Re: Ideas to improve maemo.org design

Quote:

Originally Posted by allnameswereout (Post 211282)

I've made a stub about the usability experiences at https://wiki.maemo.org/Task:Usability_experiences it doesn't contain any proposed solution for the necessary framework required to include the usability experiences yet. Because of the importance of such framework instead of including my suggestions on this subject I rather see discussion about it first.

The www.openusability.org you mentioned looks interesting : Provide a way to for FOSS developers to get in touch with usability experts and graphic artists. Apparently they have done this for the Gimp and KDE. I was also thinking this maemo emulator could be used to let people test software without owning an Internet Tablet.

Re: Ideas to improve maemo.org design

Quote:

Originally Posted by allnameswereout (Post 210095)

.... I don't know if X-Fade is a graphics artist...

I certainly am not ;) Better leave that to the professionals.

Re: Ideas to improve maemo.org design

As to "desktop sized".. I think this means different things for Windows and non-Windows users, or at least it used to. My impression is that at least in the past everybody on Windows (or the designers) thought that all applications should be full-screen. But I'm not using my browser windows in 1920x1280 even though I have a monitor that wide, I always have lots of windows open and they're all in about 1100x1000 or 930x880 or thereabouts. Something looking approximately like an A4 page, anyway.