Well, this could be a horrible experience, but I need a favor to ask.
Could you take a minute of your time to review the design for my recently released side project: Code Line Daily, please?
Keep in mind that I am not a designer, and I do not have any education in design principles nor in design tooling.
Now, hit me with the best and the worst of comments. 🙈
Once I gather all the feedback, I would implement it in the current site.
Thanks!
The first revision of Author page: https://projects.invisionapp.com/prototype/Code-Line-Daily-cjzlr00lz002fan01i2i608k3/play/a9d28b19
Design prototype: https://projects.invisionapp.com/prototype/Code-Line-Daily-cjzlr00lz002fan01i2i608k3/
Project home: https://cld.silvestar.codes
Top comments (14)
First of all, you should probably use a monospace font for the code, e.g. fira code. This looks grotesk (please excuse the pun). In addition, the description and name look a bit misplaced outside of the box, maybe better put them inside?
Also, having a fixed width is wasting lots of space on wide screens and you have the same font size for every screen size. Maybe consider using calc() and vmin/vmax in your font size.
Thanks for the suggestions!
Could you be more specific? Which description and name look misplaced?
The design would be responsive. I would definitely use a smaller font for smaller viewports.
The one at the bottom of the lines of code boxes.
You got it wrong. That is the current site, but I am talking about this prototype: projects.invisionapp.com/prototype....
I know the current site is not good. :-)
Ah, wrong URL, my bad. In this case, much better, but now it is a bit difficult to distinguish the code from the surrounding information.
I am working on that, yeah. Check out the first revision: projects.invisionapp.com/prototype....
Much better. Go easy on the rounded corners, those look a bit overdone.
First the positive:
I like the colours. I like that there are subtly different shades on the background but that the contrast with the text is good where it matters.
I like the large, clear text.
I like the clear indication of the current page with an underline. I'm going to assume that hover states are similar, but just not something implemented in invision.
The logo is neat.
Then the other hand gets to wave about a bit:
I find it difficult to navigate because nothing stands out more than anything else; there's nothing to draw my eye. This means that I have to scan every piece of text on the page to find out what my options are.
The full-width text is too wide and makes my eyes scan left-to-right too far. It's not a problem with a short piece of text, but if you have a page with more content, it'd get tiring and make it harder to keep my place while reading.
I'm not keen on the grid layout. The problem with this sort of layout is that it's not obvious what order things are sorted in. If it's a small page, it could be two columns of blocks, reading down then across, like a newspaper, but if it's a longer page or an infinite scroll then it's probably read across then down.
I don't know how things are sorted. Is it by date or by tag, or some combination?
I think the font is a little bit wooly. I don't have a better word for it than that, but look at words like "Home" in the top right. It feels a tiny bit too rounded and letters like the "H" and "e" look too soft for my taste. It makes it ever so slightly harder to read.
The logo in the header doesn't need to have the site name in it twice. The name inside the light green block will be too small to read when being used in other media like print, and it looks fine with the name hanging off to the right. This is how you use it in the footer, and it looks good there.
Ben,
I have just updated the Author page (projects.invisionapp.com/prototype...
Would you say I am on the right track?
Awesome feedback! Thank you so very much.
Personally I like the old-school terminal-like design.
The only comment I would make is that I find it difficult to find what's clickable (well without clicking). The mouse pointer doesn't change when hovering the link, the style of the links are the same as normal text, it is quite confusing.
Else it's nice, good job! 👏
Thank you for the feedback! Nice catch about links.
Updating your front on the clickable region to be a different front. Colour scheme wise it might be too retro that I won't want to be looking at it.
Maybe u should use the colours schemes from Coolors.co to pick a better scheme for the website.
The colors are different shades of the theme color, logo color. I might consider using other shades, though.
Thank you!