rchain / bounties

RChain Bounty Program
MIT License
90 stars 62 forks source link

M> rchain.coop v.3 - cooperator feedback #156

Closed patrick727 closed 6 years ago

patrick727 commented 6 years ago

This is to aggregate comments from the cooperators about https://rchain.fabco.tech/ which will be the next website iteration.

Goal: Re envision the rchain.coop to include new information funnels for beginners edu, developer edu, events, and membership.

patrick727 commented 6 years ago

kitblake- The top graphic has a past-(present)-future look. A switch from mechanical age to network age. (I put present in parens because unless it's that cylinder I don't really see a present, just past-future). I like the green-orange colors.

The "Key Value Proposition" level is kinda white and weak. The borders and text needs to be darker to be better legible. Maybe an image in each box. Something....

The images in "Dive Into the Tech" are mixing mechanical and network effects. Assuming that's a theme we want, I think it works. The image for Multi-chain might be overly mechanical.

The "Roadmap" level also needs enhancement imho.

Before I dig further, this site is meant to replace rchain.coop, yes?

patrick727 commented 6 years ago

More feedback from discord "Will there be a website redesign before the main launch? Don't have access to post in the website-dev channel. So here is some feedback, if someone could please relay this to the right channel. On https://rchain.fabco.tech/ :

Don't like the green-orange gradient at the top. Also not clear what the main image represents. Old to new tech? Middle white section, value proposition, is weak. Lots of dead space. Lack of cohesiveness overall. A strong cohesiveness in a website can be developed by utlizing a strong color scheme which uses one overall hue with a few complimentary accent colors. This further enhances the message you want to convey to the audience. A great example of a clear and cohesive website design (in my opinion) is https://iohk.io/"

patrick727 commented 6 years ago

Hello @ValeBF you're in now!!!

@Rafkraft, and Valeria keep in mind that we don't necessarily need to follow all feedback, just read through the comments and we can meet about any points that we consider to be change-worthy.

Rafkraft commented 6 years ago

Today I uploaded the new /about page i worked on with Valeria, and some updates on the footer and home page.

https://rchain.fabco.tech/about

I also set up the structure to handle multi-language properly, when all texts are ok, it will be easy to set up a chinese version, accessible with an argument ?lng=cn (for example) at the end of the URL.

patrick727 commented 6 years ago

@rafkraft great work thank you!

I will make it a point in the near future to start working on content for you to use in the website. Shouldn't take much time.

patrick727 commented 6 years ago

@Rafkraft and @ValeBF this is Steve @bjornagain!

he has been contracted by pyrofex to work on rholang.rchain.coop so we should keep in the design loop as well.

Cheers

patrick727 commented 6 years ago

The nav on the site should be updated as follows

"Home | About | Dev Portal | Documentation | Join Now"

The first call to action may need to be changed from whitepaper but either way we will need it "above the fold" meaning that the person should not need to scroll down at all on there device to see it

also notice on https://www.riotgames.com/ how there link to home page is just the icon i like that and the "The RChain Cooperative" can sit where the large logo is right above "the scalable blockchain"

I will also take time to work out the copy for all of this soon

cheers

patrick727 commented 6 years ago

The bottom under "social media" we could change to "Quick Links"

and put the following

FAQ - icon with a ? Medium - Youtube - LinkedIn - Twitter - Telegram - Reddit - Github -

possibly hackernews

Rafkraft commented 6 years ago

I worked on general design issues today. https://rchain.fabco.tech

@patrick727 I'll work on your last remarks very soon !

Ojimadu commented 6 years ago

I think the

  1. RChain logo should be clickable and lead to the home page
  2. The colour combination is rather too simplistic. Just a dark (black?) colour and white produces a stark contrast which imho is too bold. A play of three to four colours blending into each other would create a better flow (a colour wheel might help here). Also I'd recommend this read http://www.vandelaydesign.com/the-psychology-of-color-in-web-design/
  3. The website is quite too static, I think a little gamification like hover text, scroll spy, carousel and some unique animation would be make the site look fluid and interactive.
  4. The website does look nice on mobile. It is not fully responsive.
  5. I thinks there should be a kind of news and media section on a part of the homepage where stuffs like videos and rchain related news can be uploaded/embedded.
Rafkraft commented 6 years ago

Modifications:

Regarding the colors, I find it harmonious now and wont give any modification (only three colors, we had four at first) that hasn't been approved by @ValeBF .

Regarding the twitter feed / dynamic content section, it is planned of course, I asked about it and was replied that we will add it later.

https://rchain.fabco.tech/

EDIT: I moved this task in the In progress section, I hope it's fine

patrick727 commented 6 years ago

Thanks @Rafkraft for moving to in progress.

I like where it is going.

I think we can make the first tile shrink some though, so that the image links to it top to bottom(right now there is space between the top and where the image begins)

also the rchain cooperative needs "cooperative" and could be aligned up more, which goes with the tile 1 being a bit smaller.

does that make sense?

thanks for the great work

bjornagain commented 6 years ago

Hey folks nice to make your acquaintance! I'll be working on http://developer.rchain.coop/, as well as some other web work for pyrofex. I am also available to help out here with https://rchain.fabco.tech/.

Can someone tell me if we're going to be using the styling from the new site in progress, or what is currently live at rchain.coop?

ValeBF commented 6 years ago

Hi there ! I have worked on some design editions for rchain.coop I been approaching all your comments in order to build a better site that follow a global stethic that we are trying to usea across the brand elements. Also I did some editions on the graphics in order to follow some suggestions from #145 issue.

I would like to know your thoughts and get the approbal on this desing to give @Rafkraft green light to complete the development and avoid waste of his work and time... building and edditing (bis)....

Here is the mock up link

https://preview.webflow.com/preview/rch-35ecec-60ff624c600ad0-19929651c1568?preview=dcefe7e5fde1fbd916ce9ab08c7f34b2

You should click on the little eye on left- top

screen shot 2017-12-04 at 1 23 24 pm

I will remain attentive.Thanks . VBF

patrick727 commented 6 years ago

Thanks for this @ValeBF

Tile 1

see this simulation of how the nodes will actually interact. casper

Tile 2

Tile 3

Tile 4

Tile 5

Really great progress thank you!

ValeBF commented 6 years ago

Sorry for my bad spelling ....

I edited what you pointed thanks. I left out the mesh net graphic edition, I will work on it... thanks for sharing that simulation, great visual reference to use.

Did you check the ABOUT page ? there are some changes too.

patrick727 commented 6 years ago

Thank you and I just briefed over the about, I like the design but will need to get you specific copy to use.

Rafkraft commented 6 years ago

Hi everyone, I just read the last posts

As @ValeBF I'll wait for green light from @ValeBF and @patrick727 to get this coded.

Today I worked on social integration of the website (for facebook and twitter). I added every facebook and twitter metatags (basically title, image and description).

You can have a look here -> https://developers.facebook.com/tools/debug/sharing/?q=https%3A%2F%2Frchain.fabco.tech%2Fabout

At the moment we have just one image for every page, we can totally have one for each page (dimensions must be 1200x600 for facebook, and another image at 600x314 for twitter). I chose arbitrary some titles and descriptions to appear on facebook and twitter, I guess it will change too.

/about page https://rchain.fabco.tech/about I copied some team member descriptions from https://rchain.coop, the missing ones are still Loreum ipsum...

About translations @patrick727 if you whish we can totally have a document where every translation of every part of the website is written, this way, when translations in english are ok, we just send this document to the translators and they send us back the translations. Do you think I can work on this document template ?

patrick727 commented 6 years ago

@Rafkraft great work on the social and about page.

under Cooperative Governance, we will need to clarify the profile and descriptions are the "Board of Directors"

I will start focusing on copy for website soon and provide you with those wordings.

That's a great idea for the documentation page.

Let's create a separate issue for that within this "website" project for that.

patrick727 commented 6 years ago

quick side note: @Rafkraft I can create another issue if this is works out, but would there be a way to do a similar plugin translation option for the RChain Developer wiki https://rchain.atlassian.net/wiki/spaces/CORE/overview ???

Rafkraft commented 6 years ago

The translations document has been done. 😃 Now we'll just have to fill it 😄

Concerning the wiki website and dynamic translations, I don't really know how this atlassian wiki works... If a wiki will be developped like rchain.coop (wiki.rchain.info for example), I guess the developper will figure out how to handle dynamic translations.

patrick727 commented 6 years ago

@Rafkraft I inputted a bunch of content to the doc and still awaiting some confirmations for other portions.

The latest website preview can be found here. Note the color pallete will change, think more about the layout and what color pallets you'd like to see.

kitblake commented 6 years ago

The new logo looks superb in the website context! I think #3 is a keeper.

Rafkraft commented 6 years ago

Very cool stuff !

I'll work on these new designs and texts very soon, then I'll give an update here !

Rafkraft commented 6 years ago

Multi-language is now stored in cookies, and can be overriden with the URL parameter lng= I added german support just to show how it works:

https://rchain.fabco.tech/index?lng=en https://rchain.fabco.tech/index?lng=de

Visit the two, you'll see the language change (upper right corner with the flag), this happens on the server side (html page is initially loaded with the correct texts). You can also change the language manually by clicking on the flag, this happens client-side (texts are changed dynamicaly when language changes).

At the moment we have no traductions in german, later you'll have the content changed of course !

Everything is setup for multi-lang support now ! So I'll put my efforts on the new design and carrying changes the texts too.

Have a good year, Back to you very soon ;)

kitblake commented 6 years ago

Great news about the multi-language options! Can anybody recommend a translation tool or site? By that I mean a website/service where you put up the English strings, and then others can translate them one to one. I've seen these in action but never used them, and they're much more friendly than editing i18n files.

Rafkraft commented 6 years ago

I worked on a google doc that I called "tanslations document - EN", it contains all texts and sentences that appear on the website, when it's filled and finished we will create CN, DE and other documents to handle the translations.

I guess this document has not been shared with you since I don't have your mail address :/ (right now it's editable by @patrick727 and @ValeBF)

Maybe there is a better workflow but ATM we are working with this document to handle the changes and it's fine !

Ojimadu commented 6 years ago

Cool stuff @Rafkraft. You have a very good idea creating the "translation documents" it would come handy for translations and would ensure consistency. @kitblake do you mean Peer translations or paid translation services offered by companies?

kitblake commented 6 years ago

I mean peer translations. But I just spent some time searching and I can't find the tool I once saw. It was a web-based service that made it easy to translate website or application text. You upload the English strings, then volunteer translators select a language to translate into, say French. In the UI the English strings appeared on the left, with textareas on the right for the French version of each string. Underwater the translations were saved in the proper (i18n .po file) format for use in the app.

tet123 commented 6 years ago

You probably mean something like: https://locize.com or https://www.oneskyapp.com

dckc commented 6 years ago

The body text font size is quite small. Chrome dev tools tells me it's 0.9em. Shouldn't it be 1.0em by definition?

dckc commented 6 years ago

What are the goals of this redesign?

Is there a due date for feedback?

Rafkraft commented 6 years ago

Yeah locize seems like a very good and powerful tool, on rchain.coop I'm working with i18next at the moment, this tool seems to be compatible and provide options for it. I'll check it more deeply and maybe open an account.

@dckc ok your remark about font-size is wise, I think I'll shrink default body text to 1.0em.

Updates:

Cheers all

Rafkraft commented 6 years ago

In order to track daily conversions/clicks on buttons/audience, we need to setup an analytic solution, the default one is Google Analytics, I've set it up on many website already and know how to work with it.

Has anyone ever used Heap ? https://heapanalytics.com/ Seems to be a great tool (and even easier than GA), maybe we could use it instead of google analytics.

@patrick727 any thought on this ?

Keaycee commented 6 years ago

Great work @Rafkraft and @ValeBF . I think we are making progress and things are really taking good shape. Accessing this site on a pc really look responsive but static. But on the mobile aspect, the web design is not responsive. The mobile view is also very important in this present age because individuals prefer to access site more on their cellphone because it's handy. The blockchain site is very responsive in both side and lots of individual access it through their cellphone because it's portable and handy. I also think the website look too static and lack some elements that will help gamify the site so it could look more interactive. However it's a good work keep it up..

patrick727 commented 6 years ago

@Rafkraft we could try heap, i've never used it as i'm used to the default GA and GTM's @Keaycee thoughtful points, Valeria is working on the responsive design to give to raph. @ValeBF has the latest preview here https://preview.webflow.com/preview/rch-35ecec-60ff624c600ad0-8019ad6dae9fd?preview=8653e6ab32f36a182ad8ce34caa5b216

dckc commented 6 years ago

Whatever surveillance technology we employ, be sure to disclose it plainly in a privacy policy.

The current rchain.coop site uses google analytics without disclosing it. Very un-cool.

Rafkraft commented 6 years ago

@dckc You're refering to a small popup appearing on first visit "We must inform you that we may track some events on this site to improve user experience, by staying on this website you accept to etc....." ?

ValeBF commented 6 years ago

Hey! @Keaycee here is the new design mockup https://preview.webflow.com/preview/rch-35ecec-60ff624c600ad0-8019ad6dae9fd?preview=87080441dc8fb8e15acae80e3f84e562 I have been working some editions and restyling

I am attentive to any comments you guys have about this

Keaycee commented 6 years ago

@ValeBF @Rafkraft You're doing quite a good job. But we would like to have a demo preview of your work. You need to include Privacy, Terms, Support (Help Center, Tutorials, Learning portal), Company (About, Team, Career, Interviewing, Press, Blog & Faq), Product(wallet, Business, market) ETC. This is a good work in progress. What do you suggest? @patrick727 @kitblake @Ojimadu @dckc

Rafkraft commented 6 years ago

Ok there are several changes, I'll build another UI kit (v1 is -> https://rchain-ui.fabco.tech/) since colors and general tone have changed (from blue-green-pink to black-grey-pink).

@Keaycee I guess @ValeBF and I are designing/coding two pages, and when we reach general agreement and agreement with the hierarchy, we'll do all the others. (in order not to re-code everything when the theme changes).

patrick727 commented 6 years ago

@Keaycee the "dev portal" is the learning portal.

"product" we will leave out for now as it may be a section in "about" for partners such as holdings, ventures etc and they can present their products.

we can put a section at the bottom for "more" like status.im does and put "jobs" there but I dont believe it should be in the Nav or About because we do alot of outreach for jobs through our network and don't really need a flood of resumes at the moment, but that could change.

@ValeBF , @Rafkraft this is looking really good, i'll have a couple more updates to the content soon and get back to you. much appreciated.

I'll look more into how we can/should display that we are tracking cookies. ledger does a popup so maybe we will do the same.

bjornagain commented 6 years ago

Hey guys,

This design mockup looks outstanding. Is this the direction you're going for the new rchain.coop site? Is this to replace the design here: https://rchain-ui.fabco.tech/?

On Mon, Jan 15, 2018 at 5:38 AM, Valeria Benitez Florez < notifications@github.com> wrote:

Hey! @Keaycee https://github.com/keaycee here is the new design mockup https://preview.webflow.com/preview/rch-35ecec- 60ff624c600ad0-8019ad6dae9fd?preview=87080441dc8fb8e15acae80e3f84e562 I have been working some editions and restyling

I am attentive to any comments you guys have about this

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/rchain/Members/issues/156#issuecomment-357685271, or mute the thread https://github.com/notifications/unsubscribe-auth/AFVkORzmclOd__7v0B7ltzFh5-Oda-Qsks5tK1TkgaJpZM4QT9rW .

Rafkraft commented 6 years ago

@bjornagain https://rchain-ui.fabco.tech/ is just a UI kit, a styleguide in other words, this document explains how to use a CSS library I coded. Some other devs at Pyrofex will probably use it. (for developper.rchain.coop for example).

The problem is that the colors changed, so I must do a UI kit version 2 ^^

bjornagain commented 6 years ago

Sorry I meant to use this link: https://rchain.fabco.tech/

Is there a tentative deadline to get the redesign live on rchain.coop?

On Tue, Jan 16, 2018 at 2:04 PM, Rafkraft notifications@github.com wrote:

@bjornagain https://github.com/bjornagain https://rchain-ui.fabco.tech/ is just a UI kit, a styleguide in other words, this document explains how to use a CSS library I coded. Some other devs at Pyrofex will probably use it. (for developper.rchain.coop for example).

The problem is that the colors changed, so I must do a UI kit version 2 ^^

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/rchain/Members/issues/156#issuecomment-358122933, or mute the thread https://github.com/notifications/unsubscribe-auth/AFVkOV_mOt5PTO74vRmZb0HzD2XeC6gRks5tLRz4gaJpZM4QT9rW .

patrick727 commented 6 years ago

@bjornagain the goal is to have it ready along with the developer.rchain.coop portal, so end of the month is ideal, best would be end of this week but that's more pressure then I think anyone wants.

@Rafkraft I like the UI kit and the styles derived from it. @ValeBF could you weigh in on the coloring of the new mockup? Which I think is looking quite nice as well.

Keaycee commented 6 years ago

End of the month is ideal but there won't be need for a rush while working on the redesign. Take your time for a better result @ValeBF @Rafkraft . some suggestion were made by @patrick727 . Your work is great @ValeBF @Rafkraft

Rafkraft commented 6 years ago

RChain UI Kit version 2 is online ! (maybe you'll have to clean your cache) https://rchain-ui.fabco.tech/

This is a I said few posts earlier, a CSS library to be used in every rchain.coop related projects, so everyone use the same components and have the same visual identity.

Of course I used the mockups done by @ValeBF as a model. https://preview.webflow.com/preview/rch-35ecec-60ff624c600ad0-8019ad6dae9fd?preview=87080441dc8fb8e15acae80e3f84e562

https://rchain-ui.fabco.tech/

Now I'm working on https://rchain.fabco.tech/ , updating everything to match with the new mockups !

Ojimadu commented 6 years ago

@Rafkraft The UI kit version 1 and 2 has a small typo 'developer' is spelt 'developper'. It occurs twice there (or is that a style?). Nicework on the UI kit.

Keaycee commented 6 years ago

@Rafkraft also check the year at the footer of https://rchain.fabco.tech/ is outdated, still says 2017. It should be updated with a script that automatically updates the year without having to manually change it every time we enter a new year.