@boudewijn: thanks for the clarification

I took @charblaze design ideas and tried to flesh them out a little further. I originally thought that you added jpegs, but realized firefox does a poor job with anti-aliasing with their internal PDF viewer. I got everything.

wireframes: http://www.scottpetrovic.com/uploads/kr ... mes-v3.pdf
SVG: http://www.scottpetrovic.com/uploads/kr ... -v3.tar.gz

I like the Blender sub menus. The one thing that is confusing about their menus is that their sub menus change tha parent location. For example, if you go to their support page (http://www.blender.org/support/) and click a sub menu like FAQ, it changes the word Support to FAQ. Now FAQ is just duplicated on the top, and the sub menu. What do you click to go back?

I thought the pages are clearer if the sub menu items are more like tabs. If you click Download, it will just take you to the first tab (Krita Desktop). That way it is easier to understand and a stronger 'visual scent'.

One thing in the design is the location of the FAQ. I am starting to doubt if we need that in the main navigation. It is ok for new users, but quickly becomes less useful after visiting it once. I thought it might be better to stick it as a sub section. Put links to the FAQ page in other sections where people might be interested in it.

I also updated the footer with a few links. I thought of some common scenarios that might not be easily discovered from the main navigation.

There is a lot of content that needs to be updated still on these, but I think you get the gist of it.

@scottpetrovic: First, one question regarding the wireframes. Is it supposed to be a full width layout? Can you explain how the layout is interpreted in a browser window? Or is it meant 1:1?

And some Feedback:

Footer:

I would store a more ore less complete sitemap in the footer. (2-3 columns with content blocks, discontinued from the main-content by a subtle top-border and differen background-color) | Sitemap | Sitemap2 | Social + Login |
This adds extra functionality without the cost of precious space.

Features Page: +++

it´s good - nothing to complain about..

Additional note:
Maybe anywhere at this page is a place for a quotes of Testimonials box thingy (an idea of a previous post). I like that idea and i would go one step further and try to get permissions to display an avatar or portrait photography along with the quote. (round image - "Quote") I could imagine to give the page (Features - Features) a lot of white space and display the quotes irregulary and intermittent left / right aligned between the "single" feature sections. Or alternatively show them at the top (or in the header) as an animated slider.

Download Page: +

Download Box: very close to blender.org eh? but why not, i like the box - it´s a good solution - simple and clearly.
Submenu: The different versions of krita WILL confuse a new user - i would swear on this..

I would suggest to omit the submenu completely or change it to: Download | Requirements (or whatever else is useful here) and presenting the different versions on one page like this:

A Short crispy overview: supported platforms/differences of verisons/relation to steam platform etc. 2-3 well formulated sentences.

<section>
Krita Desktop
...
</section>

<section>
Krita Gemini
...
</section>

<section>
Krita Studio
...
</section>

The pages/sections for the versions itself are looking good, nothing i would change here, just put it on one page to avoid giving the user the impression, that he must make a decision here. Different pages emphasize - "This are completely different things", while putting it on one page is more like "the same with some differences".

About Page: ++

It´s good - i like it.

Additional note:
I, and i guess other people as well, like the touch of something personal. The Humans behind it. I hate pages where you can hardly find any name or image of the authors (beyond the legal informations). So i would suggest, that this page should contain something like this.. Some of the faces behind Krita - developers, users or contributors - no matter. Just giving the impression of a living and active project driven and used by people.

Technically spoken, i would use a tabbed navigation with hidden sections storing all content in one page for the reason, that this page mostly contains text and the content is static -> no extra loading time; nicer transistions..
(note: when the tabs are not clearly visible (seperated), so that the user isn´t aware of the onPage (local) navigation, their might be the need of manipulating the behaviour of the browser back button for a consistent navigation, but i am not sure about this. I guess there is a solution to add the #local navigation to the browser history or something similar)

Learn Page: +

I do not like the term "Learn" and i cannot associate it with Resources in anyway else, than learning-resources (not brushes or textures). We should not underestimate how much users will search for extras like brushes. When you take a look at the current statistics and calculate the views / time-period you will see that the resource page is one of the top navigation-items. Therefor i am not sure if it is a good idea to place it in a submenu which is hard to associate with its top-level menu entry.

Get Involved +

On the first view. I have no idea about the "Ideas" item. I could imagine i would click on this just for the reason of curiosity.. What do you mean with this? Submit an idea? Maybe another term fits better? I like the rest. Separate sections by "profession" is a good idea.

Support Page: -

When i read support i think of Support for me - solving my problems. It´s one of the first items i would choose when i have a problem with a product. That´s really irritating. At least it should be called "Support us". As visitor, i would suspect something like Contact/FAQ/Know Issues under the term support. The difference between support for krita and support for the user must be clarified. I am always happy when i need to solve a problem and the website of the product helps me to find a solution fast or at least links to places where my problem could be solved. That gives a 5-star bonus rating in my mind even if the rest is not so good....

@vascobasque: good points. A few questions.

You have access to the analytics? I am completely in the dark to that right now. If you could somehow share that, it would be very useful with these decisions.

For the layout - The design is going to be responsive. I was thinking something like Blender, that some of it would be full width, and a lot of the content itself would have a max width. I haven't thought about what we should pick for the max width for the content area. Statistics would help with that decision.

Sitemap: I would be ok with a more complete site map. Are you very good with Inkscape. Feel free to take the SVG files I provided and modify them with your ideas.

I like a lot of your ideas in general about the what the content should be. The testimonials and people pictures in the about us is a great idea (for features and about us).

Learn Page: I didn't understand what your solution is by what you wrote. Are you proposing to change it to Resources instead? I would be ok with that.

Ideas item: that was my lame attempt at suggesting features, usability, or other feedback. It could use a better term.

Support: I like "support us" better. Support does sound like reporting bugs, crashes, etc.

tabs idea: I agree with that approach. We will have to see later about technically implementing that to work with a CMS.


Download Page: The download page is going to be tricky. I couldn't think of a better area to put Gemini and Studio. People are going to get confused whenever they first see these other flavors - whether they are on the download page, or elsewhere. I don't care as much whether they have separate areas or are on one page. I think as long as we do a good job explaining and distinguishing between them, that will be the best we can do. I want to keep it close by Krita Desktop though since they are all products in the same family.

Nope - no access, just the joomla adminstration. You can see the views for every "item" there, but only in absolute numbers. To get a better idea relate the views to the time the item is online.

GD Folder

Look at the different layouts in the documents folder above.. i guess you want it roughly like it is shown in frame_0001?
There is also a footer.pdf just to visualize my proposal.

Some extra Notes to Responsive Design..

Global trends for Screen sizes in 2013 have been:

1. 1366 x 768 (an i-pad screen size as far as i remember)
2. 1280 x 800
3. 1920 x 1080
4. 1440 x 900
5. 1024 x 768

< 1280px max width is commonly recommended. From there it´s a question of breakpoints to get the optimal result for different device categories (eg. smartphone/tablet/desktop) I think the easiest way is to plan with a desktop size. With a grid system most elements of the layout will adjust without much additional work, but some elements will need some extra attention (eg navigation elements). The bootstrap framework is made with this approach in mind. If we use that we will not have to worry so much about all this stuff...

Another way would be to plan for a small sized device first ("mobile first") and with additional space you can display more information or additional design elements. The good thing about this approach is that you focus on the absolutely essential things first.


With the Learn page - it´s okay - i have no solution, but i think this should be more clearly. Not necessarily in this stage. This point and also the question with the Download Page can be adjusted later, maybe even after the page is online and feedback is coming in.. For now it might be better to go forward with the basic design and layout. Don´t worry too much about what i write - i am a really fussy person sometimes

Regarding the Ideas Item: I would say it depends if this functionality is needed as a single menu-entry or extra page? I would call it "Suggest a feature". I could also imagine to use a submittable form, to offer a way of feedback, without the need to create an account for the forum or the kde-bugreports page. But there might be other ways to poke the visitor to the right places, too.

I find it a little bit unlucky that feature requests/wishes are kind of "hidden" behind the bug reporting platform. For someone who isn´t familiar with open source communities or especially kde, this is not very obvious. But that´s a kde thing, isn´t it. Idk if krita.org should go own ways in this point.

I agree with @vascobasque that we can probably move forward to the high-fidelity (pretty) mockups now. I will take it that silence means we are on the right path. The type of changes we are making now can be done just as easily on a CMS. Let us proceed!

I updated my wireframes slightly based off some of vascobasque's recommendations (mostly the footer area).
http://www.scottpetrovic.com/uploads/kr ... -v4.tar.gz
http://www.scottpetrovic.com/uploads/kr ... mes-v4.pdf

I am not too particualar about the exact layout of the footer. Mine is slightly different than vascobasques.

I kind of like the new thread for a new topic. I will see about getting this one closed and starting a new one. I will post the new thread link in here before it is closed.

I created a new thread so we can start channeling our ideas into the mockups.

viewtopic.php?f=139&t=121313

We can continue the converation there. I will see about closing this thread.

This topic has now been closed as requested.