There has been a lot of work going into the new upcoming blockstack site by @glepage @light and others. Really like purple color theme.
The site is open source so you fork it and submit pull requests.
6 Likes
Thanks @larry.
Proposal:
- Either need to add a line break as seen in the 3 line layout
- Add the second “Join the Blockstack Forum” link back into the layout
One thing the community has been debating on the hero page is that we have only one link to join the community and that link being to get invited to the Slack channel. I feel that we should have a secondary link to join the forum as well. I feel the forum is just as important as the Slack channel. Especially for those in other time zones such as yourself.
The other thing the community has been discussing in Slack is the layout of the hero section to get the eye flowing down the page. Originally, I intentionally designed the layout to have the hero section broken in three lines to explicitly and immediately communicate “Blockstack”, “Open Source”, “Blockchain”. The design was also created for balance and flow. In design the magic number of balance is 3. In this case the 3 headline lines are balanced in a triangular manor.
The 2nd most important design fundamental for interactive design and communications, right behind immediate engagement, is flow. Most cultures read starting at the top left flowing down the the bottom right. Through centuries of reading in this manor we have been conditioned to engage webpages the same way. The eye tends to want to start at the top left, the most expensive real estate on a website, and flowing to the bottom right. This “flow” is very important in getting users to not only engage but quickly read copy in a natural and esthetically pleasing manner. This can be executed through a variety of design conventional (easiest execution) and unconventional (much harder execution) tactics by utilizing whitespace, type size (big and/or small), use of color, highlighted elements (big and/or small), and so on. The original design was initially created with the focus on capturing the audience, to prevent them from bouncing, through flow. This flow was intended to guide the users eye down the page from top left to see the community logo (brand recognition), then the three words, “Blockstack”, “Open Source”, “Blockchain” to imprint our mission into our audiences subconscious. By utilizing a bit of space between the logo in the top left and the high contrast headline, the users eye would then hit the first word in the headline. and see the 3 three main highlighted words mentioned above. After which the user would naturally either read the secondary content or hit the main call to action button “Get invited to Slack!” and more likely than not skip over the “Join the Blockstack Forum” button. Having this forum button there with a large amount of text and short right and left margins makes the button a decoy button to add balance to the design and guiding their eye down to the bottom right of the page. To also ensure that the user is enticed to see the “Get invited to Slack!” button there is a colorful, recognizable and popular slack logo placed inside the button. To add even further flow to the layout as well as add mystery to the brand, the use of a dark gradient background set at a 45° angle going from dark in the top left, to make the contrast of the logo and the headline pop to the bottom right beautiful purple color to guide the user down the page. This is an effective way to capture the user. We know that once captured the user is more likely to read more of the content on the page.
The other solutions to the headline content breakage are as follows;
- Either need to add a line break as seen in the 3 line layout
- Devise new copy
- Redesign the hero section to be a more natural flowing layout
- Make the hero font a lot smaller so the eye will flow down the page.
Please weigh in your thoughts. I’ve also included an eye mapping image to this post to show how the eye flows down the page.
1 Like
@glepage I see your points and I agree. Definitely think we should be pushing the forum too. How about we try this and see how it goes?
The first solution you proposed.
The forum should be pushed as more important than slack for the following reasons:
- The forum is open source & public - blockstack is open source and public
- We’ll be able to integrate blockstack technologies into the forum, ie. log in w/ blockchain id - slack is proprietary so we can’t change it
- Forum is indexable and will serve as a reference for community culture/history. Slack chat history disappears into Slack.
I’d also hesitate to put slack’s logo on the site. I don’t think they need our marketing help.
Seems a bit wordy - is there a non-open source blockchain community?
Could the following work?
Blockstack.
The Blockchain Community
1 Like
Re Slack chat history. I recently noticed that channel like #bitcoin-dev log all chat history to external public chat logs. These logs turned out to be very valuable years down the road.
BTW, to be clear I’m not arguing for using Slack less because I’ve seen how powerful it is on a practical, day-to-day level. Just pointing out that public chat logs is something we should look more into.
2 Likes
The forum should be pushed as more important than slack for the following reasons:
The forum is open source & public - blockstack is open source and public
We’ll be able to integrate blockstack technologies into the forum, ie. log in w/ blockchain id - slack is proprietary so we can’t change it
Forum is indexable and will serve as a reference for community culture/history. Slack chat history disappears into Slack.
We are finding the engagement rate comparison between Slack and Forums to be a MASSIVE difference. Having said that the Forum is a very important community communications tool. I personally feel that they are both equal. Slack wins for engagement. The forum wins for static posts.
I’d also hesitate to put slack’s logo on the site. I don’t think they need our marketing help.
Agreed that they don’t need our help with marketing. But having said that, we are using their logo for three very purposeful reasons.
- Assistance with eye flow. To also ensure that the user is enticed to see the “Get invited to Slack!” button there is a colorful, recognizable and popular slack logo placed inside the button.
- Draw attention to the button. Again the colorful logo draws attention to the logo as well.
- Piggy-back branding. Slack is a very strong and powerful brand here in North America. A very respected brand amongst the developer community and they are moving at an impressive rate due to their UX. We are using this logo partially for the subliminal association with a strong brand.
Seems a bit wordy - is there a non-open source blockchain community?
This is a fun-fact that was quite interesting to me. The power of the words “Open source” amongst the developer community is almost like no other. It’s one of the top words used as a hook to get developers to stop, read and pay attention. I firmly believe we’ve nailed the copy for the hero section in my professional opinion.
2 Likes
Take a look at the “Invite me to Slack!” button on https://openbazaar.org/. What do you guys think?
1 Like
I think it’s where I got the idea for ours. Except we need to have a color logo. Tried the reverse logo but the eye skipped over it.
1 Like
I like @glepage’s version better - the color of the slack logo really makes it stand out & the fact that it’s above the fold instead of hidden at the bottom of the site.
“Get invited to Slack!” sounds like I’m leveraging connections to get an in to the community…makes me feel like I’m cool. “Invite me to Slack!” sounds more mechanical.
I think the current copy is pretty tight - people interested in blockchain infrastructure again going to want to join. I may be biased of course.
2 Likes
Hi,
Is there any link between blockstack.org and blockstack.io?
Can’t see any link except blockchain technology and the name is the same.
Pete
1 Like
No there is not link or correlation between the two. Blockstack.org is a community for building a common blockchain application stack. Blockstack.io is a company. We are not sure what they do. It’s an unfortunate name collision.
1 Like