First time here? Check out the FAQ!
5

Feedback on new skin

Dear askbot community,

I finally managed to get my new template into a more-or-less functional state. It's more focused towards a community and uses strong typography, clear gutter, a consistent icon set and some neat UI tricks I've learned over the years. It's about 90% complete, with a few things missing. Here's a screenshot

image description

You can get the skin as my github fork (branch to skin-suave). Please leave your comments, and suggestions (either here, or at the github issue site), and feel free to fork and fix stuff yourself! Here are two more details:

image description image description

Enjoy Manuel

maebert's avatar
133
maebert
asked 2012-01-04 10:47:14 -0500, updated 2012-01-04 10:48:51 -0500
edit flag offensive 0 remove flag close merge delete

Comments

Looks awesome!

Evgeny's avatar Evgeny (2012-01-04 10:49:15 -0500) edit
1

I like that, looks nice. I would suggest that you put the quesion's tags at the bottom, in the same line of the "post a comment" button, since it makes the question more readable. Keep up the good work.

Hanan Natan's avatar Hanan Natan (2012-01-04 12:33:03 -0500) edit
1

Wow, really cool! What are the 10% missing? And how long did it take you to get the skin to 90%, Manuel? What problems did you come across? (just to know what to expect if we try to create our own skin, too :-)

piskvorky's avatar piskvorky (2012-01-06 05:58:27 -0500) edit
1

Look great, I like the hover effect on avatars

byron's avatar byron (2012-01-06 14:44:30 -0500) edit

Good suggestion. I thought about it earlier, but in fact if there already are any comments the button won't be in line anyway. I might move it up to the row with the vote buttons (and just give it a little "comment" icon instead of text) - will make it slightly harder for new users, but remove clutter for everybody else. What to you think?

maebert's avatar maebert (2012-01-09 03:33:27 -0500) edit
2

Main Problems:

  • I rewrote most of post.js (see this question for details) because it imposed some ridiculous and arbitrary structure on the site to work.
  • Sometimes it's not very clear where certain elements come from; templates call a macro that calls another macro that uses some widget, etc...

My approach was to simply wipe the CSS file and then work myself through the templates one by one like Casanova in the nunnery, redoing the CSS and the template simultaneously.

maebert's avatar maebert (2012-01-09 03:44:25 -0500) edit
2

Missing stuff:

  • Login / Signup pages are totally messy
  • Not entirely satisfied with the profile page
  • Might redo the suggested question autocomplete
  • A lot of testing:
    • Haven't tested whether everything is working as it should under all conditions yet
    • No cross-browser testing yet
    • No testing on mobile devices yet
  • style.less still needs to be optimised.

As for how long it took me: hard to tell, has been my evening project for a couple of weeks. Once the general design idea was set, I reckon about 30 hours.

maebert's avatar maebert (2012-01-09 03:46:06 -0500) edit
add a comment see more comments

2 Answers

0

Manuel, the skin looks great! Besides the attractive design, I like that the user image is more prominently on the left, the sharing buttons merged with the question tools - quite logical. The "rollover" effect on the avatar is great! Simplified post tools - nice but you need to explain people where the tools are - newbies may not notice them. I like that comments flow naturally under the posts.

The header imo is too large vertically. Many people want a forum as an add-on to their site - where they already have a common header. Vote buttons on the right might make it less likely that people will vote - and the votes are very important data in the forum - this will take some measurement to verify.

Very large comment button might make people comment more often than give answers, but a big button is obvious so maybe it is a good thing overall.

You are using icons in the main navigation - for you it is clear what they mean, but may not be for the people who see them for the first time. I prefer text in the navigation maybe with icons as extra enhancement.

Evgeny's avatar
13.2k
Evgeny
answered 2012-01-09 07:48:20 -0500, updated 2012-01-09 07:54:30 -0500
edit flag offensive 0 remove flag delete link

Comments

Hey @Evgeny, thanks for the feedback.

  • _Header:_ I tend to agree. I'll supply an alternative header that will be a lot smaller by bringing the User-Panel in the same line as the ask button and logo, making everything smaller and tighter (which again brings me to the question whether we can have any way of defining additional variables for templates that can be set in the live settings)
  • _Comment button:_ I agree, as said before I might merge it into the vote buttons.
maebert's avatar maebert (2012-01-11 06:29:22 -0500) edit
  • _Vote Buttons:_ Good point. We could have a handwritten-style imperative ("Vote me up") on mouse-over the answer. The design as such is clean enough to allow this.
  • _Navigation Icons:_ my fault, they should at least have explanatory tooltips.

Where is the best way to discuss the template structure?

maebert's avatar maebert (2012-01-11 06:32:12 -0500) edit
add a comment see more comments
0

This skin looks awesome. The sidebar is logically designed. And I like the way you have grouped the voting up/ down and created a toolbar which can be added on to with other features.

I would like to see some differentiation between the question and answers. May be the answers section can have smaller avatars and shifted to the right by a tab space? Or the question could be made more prominent by increasing the shadow effect.

Also as @Evgeny thinks, I feel the very prominent comment button may be a distraction when the idea is to get people to post answers as answers not a comment on the question.

alooanda's avatar
61
alooanda
answered 2012-01-09 13:27:10 -0500
edit flag offensive 0 remove flag delete link

Comments

Thanks! The answers have a slightly darker background colour than the question and will always be separated by the huge typography between Question and Answers. I agree on the comment button, though.

maebert's avatar maebert (2012-01-11 06:36:14 -0500) edit
add a comment see more comments