-
Hi Gediminas,
I really like the clear design which brings fonts (merchandise) to the front. User experience part of this site is one of the best I've recently seen. Nevertheless few remarks :)
(left menu) Menu highlight technique (black fold) is too strong and looks more like a category header than a menu item. This is a big usability issue because users will not be able to grasp the menu/page hierarchy and will be confused. It's probably confusing also because this technique has been usually used for marking section/headers not for marking menu items. I would suggest using the smaller version of it (just like in specific language listing) which looks more like a nice folded arrow.
(left menu) Section titles (Fonts by, Font lists, resources) could be stronger. This will help user to understand hierarchy of this quite busy left menu.
(left menu) Underlines under each last menu item help in quick recognition of the next section. You have it in Resources (line under Articles) but sadly not in other places.
(left menu) Seals could go below the Support as they break the logic of the menu. I understand that this was probably a marketing decision to have them above the fold but nevertheless usability suffers because hierarchy of the menu is broken.
Page name is a must. It's not enough to have a menu link highlighted on the left. New users have to understand where they are without thinking. H1 with page name (Fonts by Type Style) should be at the top in the same way you have it on Fonts by Type Foundry page. This page name should also help with the next point.
Type style can be confusing for the new and inexperienced users. I for a few seconds thought that those were the actual fonts not the main categories :) Maybe adding a table header would help, or smaller style written underneath, or improved View button (see below)
View Fonts button is pushing on the usability 'proximity rule'. Essence of this button is exact with the click on the big Style category (Display, Script) on the left and means View all fonts in this category. I would seriously reconsider moving it to the left, under big category name. It should reinforce message that this is a category not an actual font (for idiots like me) :)
Less text in Pro & Picture styles descriptions would be better as people don't read on-line and some of this text looks like unnecessary happy talk and instructions to me.
Is there a way to show all 8 type styles above the fold? It would be much better from user experience point of view (sense of scale)
Do you want to cater to inexperienced designers? They would like to see examples of subcategories as much as the categories. For example I (design rookie) would like to see all 8 styles above the fold and then all subcategories presented in the same graphical manner on the next page. It's so much easier to understand what Scrip>exotic types look like if I could see an example.
Massive and eye catching Checkout button is not needed from the start. It distracts a lot. It looks more important than Search. I'm a strong believer in that things should be given to users when they might need them (not earlier or later). There is no need for this huge button when the cart is empty.
The same applies to cart section on the homepage. I would strongly suggest putting login inputs (very needed on the homepage) there instead of this cart. Of course as long as there is nothing in the cart.
Add to Cart breaks the shopping flow by taking user straight away to the cart content. The 'up-sale' oriented process should keep user on the same page because he might add another product to the cart. Very visible confirmation of adding a product to the cart will be needed though.
(cart) Continue shopping link has an error and zeroes the My cart amounts in the header of a font listing I was previously.
(cart) Fonts (products) listed in the cart should be show in their style. I want to see what I'm buying and I don't know those fonts by their funny names. Right now I would have to click on each font name before the purchase just to double check if I have the right ones.
(important feature) Add to favourites/lightbox/bookmarks would be a great help for all users as they are browsing through all the fonts and need a tool to mark the interesting ones. This way they can show their initial choices to other team members and don't have to copy & paste tens of links or write down the font names.
(font listing) Sample Abc is too quick on mouse over. It should have a fracture of a second delay so the huge drop-down block menu doesn't show by accident and confuse the user.
I haven't looked on the other pages but I presume there would be also a few usability and user experience issues there.
I hope this helps.
Cheers!
Michael
(user experience designer & strategist)
Fonts by Type Style
-
1
Nice!
-
2
Menu is very usable
-
3
Font type?
Why is this another font family? These are also links, why not blue?
-
4
Doesn`t fit
To much noise up here.
-
5
Is this logo final?
;-)
-
6
This 3d /2d line works really well
The small hints at extra depth in the design work really well in a very graphic way with the wrap around on the highlight on 'type style' and the horizontal rule across the top of the section here.
-
7
The blue of your logo clashes with the blue of checkout
The blues are not all working together as well as they could. The pure cyan of the 'checkout' box compared to the blues on the links, the blues on the vertical navigation and the blue in the logo are all different to each other. A single use of blue would be cleaner with just some shading on the logo.
-
8
Vertical navigation works well
It works well having this on the left and the sizing, spacing etc all helps it to be easy to use and clean and clear to navigate
-
9
Kerning on display images
As mentioned before, it would be nice to have the kerning correct on these images
-
10
Highlight too strong
-
11
Section titles could be stronger
-
12
Last underline should be everywhere
-
13
Seals could go below 'support'
-
14
Page name is needed
-
15
Can be confusing for 'dummies'
-
16
View fonts is pushing 'proximity rule'
-
17
Less text in last 2 categories below
-
18
Maybe all categories above the fold?
-
19
Amateurs would like to have those on the next page
-
20
Checkout is not needed at the beginning
-
21
My cart is not needed on the homepage
Subcategories of Type Style
-
1
Perfect!
-
2
nice idea!
-
3
This is particularly well handled
The navigation once in each section is brilliantly handled. The design is clean, clear and easy to use. I like the repeat use of the display images from the first page and the way that blue and black is used in a minimal way to highlight which area of the site you are in.
-
4
The add to cart buttons feel a little out of place
I think it's the gradient and drop shadow on the type but these don't fit in with the rest of the design of the site. Maybe the treatment of the horizontal rule going 3d to 2d at the top of the page could be brought into the button design so something visually much simpler but more in keeping with the rest of the site.
-
5
the cart here is a little high
But looking on your actual site, you've fixed this and moved it down in line with the rest of the type.
-
6
re 17. to quick on mouse over

What an amazing in depth review. Really setting the standard here for us all I think. The View Fonts button was something I thought about picking up on not so much from a proximity point of view but just that maybe to be reworded to make it immediately obvious that this button links to all the fonts listed under the top level categories.