FormulaMonks / FormulaMonks/thicket

Design Update Recommendations

Open
#240 7 comments 1 reaction 1 assignee Claimed by @AquiGorka View on GitHub
design
Dominant language
JavaScript
Stars
27
Forks
5
PR merge metrics
No merged PRs in 30d

Description

@AquiGorka per your request for review of the current state. Adding some screenshots and comments below

## Landing Page

**Loading Glitch**
When the page loads after a hard refresh or clearing of cache, there's a slight glitch before the landing page appears. Fixes itself after a couple of refreshes and caching or content, but figured you'd want to be aware.
Screenshot of the issue:
35600118-d9c30680-05f1-11e8-8daa-c144509735ec

**Layout and centering**
Wasn't sure here if this layout was the end goal. I think the horizontal offset of the "Create and share GIFs..." from the "What's the big deal?" copy is a little odd. If this was the desired outcome, all good. Just looking at it on desktop vs. mobile, I think I like the mobile view better when it is more centered.

screen shot 2018-01-30 at 6 58 01 pm

vs.

screen shot 2018-01-30 at 7 01 07 pm

**BG Interactive elements?**
Will this landing have interactive background elements like we discussed? Could make the page more interesting but also may be too overwhelming. May need to test and have options to stop motion.

**Text Hierarchy**
In this copy with the bullets about "the big deal", I think each topic could use some more hierarchy on the title (ex. Decentralized, Community-Hosted, etc.) Right now being the same size/weight blends in a little bit for me. Could solve this by making the a bolder weight OR making it slightly larger for some variation.
screen shot 2018-01-30 at 7 02 24 pm

Could also use some vertical padding between each topic.

**Overall page vertical padding**
I think in general on this page, there could be a bit more vertical padding between sections. I think a little more breathing space would help the experience. Especially in the bottom section between the gradient and the "how it works" text and between the "start a new community" button and the bottom of the page.

screen shot 2018-01-30 at 7 05 49 pm

**Slider controllable with key arrows?**
Could be a nice update to have the slider at the bottom controllable by key arrows to scroll left or right. I find myself trying to do this on a lot of horizontal sliders on the web.
screen shot 2018-01-30 at 7 08 55 pm

**Footer?**
Will there be a footer of any kind on this page? Credits, FAQ, linking to Citrusbyte, etc.? Feels a little odd to scroll to the bottom of the page and just hit nothing. That bottom bottom feels as impactful when it is literally almost touching the bottom of the page. Again with padding, but I think some kind of footer would help as well.
screen shot 2018-01-30 at 7 10 17 pm

## Start a New Community

**Page Loader Location**
When I clicked the Start New Community button from the landing page, the loader appears at the top of the screen then switches to the center right as the page is about loaded
screen shot 2018-01-30 at 7 15 54 pm 2

**Read More top bar linking**
When I click the "read more" prompt in the top bar, it doesn't take me to the landing page like the footer about link does. Takes to a 404.
screen shot 2018-01-30 at 7 20 30 pm
screen shot 2018-01-30 at 7 20 33 pm

Also, I would even propose this "peer 2 peer gif app...read more" copy could be centered in the top bar. Right now, I feel like it is part of the logo almost. Like a tagline or something. May look better centered as more of an informational point?

# To be continued...

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.