After looking a while at the 1 degree rotated <div>s, even HN feels tilted. It's a nice effect, but I would only use it as an animation while hovering (i.e. animate from 0 degree to 1 degree rotation, if you must. Otherwise, don't do it to keep the interface clean). Personally, I would leave out all animations, unless they visually help the user with a certain task.
And since you're asking, here's a few things that come to mind regarding the design:
- Stick to one font family. There seems no need to semantically distinguish different parts of the text; the use of font size and decoration already take care of that. I would keep the Bricolage Grotesque and ditch the monospace font.
- It should be interesting to read the stories on the main page, but in the current setting, three columns (on 1920x1080) feels to crowded. Two columns seems to be okay for that screen size, but perhaps three columns work as well if the padding is a bit different (see next point).
- Try fiddling around with the left and right padding in the quotation blocks, as well as text justification. On smaller screens, there's about three to four words on each line, and lots of empty space.
- The ten "things to do" are identically styled as the call to action buttons ("Share your story" in the menu bar, "Start doing things that don't scale"), but there's no action involved. I think the quotation block style would be better: blue background, yellow title (e.g. "Ask for help and referrals"), white text (e.g. "Leverage your network for initial users and incentivize them to refer others to rapidly expand your user base."). The user can easily distinguish the important stuff (title) from the accompanying explanation, and it doesn't look clickable.
And some other nits:
- A few "Source" links are broken.
- Privacy Policy gives a 404.
- On the /startups page, I already forgot what the ten recommendations were. Perhaps add ten filters that automatically select the stories that involve the particular recommendation.
- Does the epicness scale go from 1 (low) to 10 (high) (or 5 it seems?)
Thanks for your great feedback! You gave me lots of good ideas to make the site better. I'll fix the turning boxes and work on the layout. I'll also make the text easier to read and fix the broken links. Your ideas about the "things to do" part and adding ways to sort stories are very helpful. Thank you for taking the time to help me improve!
And since you're asking, here's a few things that come to mind regarding the design:
- Stick to one font family. There seems no need to semantically distinguish different parts of the text; the use of font size and decoration already take care of that. I would keep the Bricolage Grotesque and ditch the monospace font.
- It should be interesting to read the stories on the main page, but in the current setting, three columns (on 1920x1080) feels to crowded. Two columns seems to be okay for that screen size, but perhaps three columns work as well if the padding is a bit different (see next point).
- Try fiddling around with the left and right padding in the quotation blocks, as well as text justification. On smaller screens, there's about three to four words on each line, and lots of empty space.
- The ten "things to do" are identically styled as the call to action buttons ("Share your story" in the menu bar, "Start doing things that don't scale"), but there's no action involved. I think the quotation block style would be better: blue background, yellow title (e.g. "Ask for help and referrals"), white text (e.g. "Leverage your network for initial users and incentivize them to refer others to rapidly expand your user base."). The user can easily distinguish the important stuff (title) from the accompanying explanation, and it doesn't look clickable.
And some other nits:
- A few "Source" links are broken.
- Privacy Policy gives a 404.
- On the /startups page, I already forgot what the ten recommendations were. Perhaps add ten filters that automatically select the stories that involve the particular recommendation.
- Does the epicness scale go from 1 (low) to 10 (high) (or 5 it seems?)