Skip to content
This repository has been archived by the owner on Jun 17, 2020. It is now read-only.

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

Closed
patrick727 opened this issue Nov 6, 2017 · 68 comments
Closed

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

patrick727 opened this issue Nov 6, 2017 · 68 comments
Labels
zz-Marketing guides: @pmoorman @AyAyRon-P @kitblake

Comments

@patrick727
Copy link
Contributor

patrick727 commented Nov 6, 2017

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
Copy link
Contributor Author

patrick727 commented Nov 6, 2017

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?

@kitblake kitblake changed the title rchain.coop v.3 - cooperater feedback rchain.coop v.3 - cooperator feedback Nov 7, 2017
@patrick727
Copy link
Contributor Author

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
Copy link
Contributor Author

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
Copy link

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
Copy link
Contributor Author

@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
Copy link
Contributor Author

@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

@kitblake kitblake self-assigned this Nov 21, 2017
@patrick727
Copy link
Contributor Author

patrick727 commented Nov 24, 2017

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
Copy link
Contributor Author

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
Copy link

Rafkraft commented Nov 26, 2017

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

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

@Ojimadu
Copy link
Contributor

Ojimadu commented Nov 28, 2017

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.

@Ojimadu Ojimadu self-assigned this Nov 28, 2017
@Rafkraft
Copy link

Rafkraft commented Nov 29, 2017

Modifications:

  • Top logo is now cliquable and leads to the home page (@Ojimadu ). Moreover I put it on the top left corner as @patrick727 guesses, I think it's a good idea.
  • Sections have been renamed/added.
  • Footer: "Social Media" -> "Quick links".
  • @Ojimadu I added some animations on some content (team members, grey square on home page).

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
Copy link
Contributor Author

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
Copy link

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
Copy link
Contributor

ValeBF commented Dec 4, 2017

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
Copy link
Contributor Author

Thanks for this @ValeBF

Tile 1

  • can you lift the RChain logo and call to action of whitepaper up about 10-15 points so its a bit more center.
  • its "white paper" you have "withe paper"
  • can you have the background mesh art faded into the background a bit more, and also will you make the size of the circles vary sum. maybe experiment with some different colors to demonstrate different size nodes connecting.

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

Tile 2

  • Also the background can you experiment with different size/color circles for he meshnet and make it fade a bit more into the background

Tile 3

  • please have the title and description higher up on the tile(i.e "Rholang + description" closer to "dive into the tech")
  • i really like how you can scroll between the different tech specs, great work.

Tile 4

  • Roadmap looks great to me, maybe different sized circles for the background and will double check on the milestones

Tile 5

  • LinkedIn is one word.

Really great progress thank you!

@ValeBF
Copy link
Contributor

ValeBF commented Dec 4, 2017

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
Copy link
Contributor Author

patrick727 commented Dec 4, 2017

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

@Rafkraft
Copy link

Rafkraft commented Dec 6, 2017

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 ?

@bjornagain
Copy link

bjornagain commented Jan 16, 2018 via email

@Rafkraft
Copy link

@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
Copy link

bjornagain commented Jan 16, 2018 via email

@patrick727
Copy link
Contributor Author

patrick727 commented Jan 16, 2018

@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
Copy link
Contributor

Keaycee commented Jan 16, 2018

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
Copy link

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
Copy link
Contributor

Ojimadu commented Jan 18, 2018

@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
Copy link
Contributor

Keaycee commented Jan 18, 2018

@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.

@bjornagain
Copy link

bjornagain commented Jan 18, 2018 via email

@Rafkraft
Copy link

Rafkraft commented Jan 19, 2018

Draft for v2 is online ! 😃
https://rchain.fabco.tech/ (clean your cache)

Of course it now uses the new RChain UI Kit I developed earlier :) (which I updated too)

What I still have to do soon:

  • Proper test on responsiveness (small devices). I checked regularly that everything rendered the right way on small devices, but I must have missed some details.
  • Proper checks on old browsers, even if we might skip support for IE < 10 (IE < 11 ?)
  • Add backgrounds on big sections : Valeria sent me mockups and background images, I'll add them soon.
  • Analytics: Add a heap javascript tag (https://heapanalytics.com/) and register and account on the website, just to see if this works.
  • Redo the social media thumbnails and preview images (since the colors have changed).
  • Still some styling to do generally and on /about page.

This is on my side, for other things like texts (still some loreum ipsum), and other pages, I'm waiting for the staff to give inputs and directions. :)

Cheers all, thanks for your returns

@Keaycee footer date is ok now !
@Ojimadu I fixed it (my mistake, that's because in french we write "developpeur" 😄 )

@ValeBF
Copy link
Contributor

ValeBF commented Jan 20, 2018

hey! @Rafkraft I saw the editions you did on the website it is nice, but I am a little worried about the design details we want to include, I am not sure if I am been premature on your dev process but I would like to see implemented the assets I sent to be sure everything is fitting properly or if there is needed any edition. Please let me know if I am a step ahead waiting for the frontend to be ready now.

@Ojimadu
Copy link
Contributor

Ojimadu commented Jan 20, 2018

@Rafkraft Nice edits on the draft but looks like @ValeBF already has some work for you.

@Keaycee
Copy link
Contributor

Keaycee commented Jan 21, 2018

@Rafkraft nice work @ValeBF keep it up. The site is already taking a good shape. Good collaborative efforts.

@Rafkraft
Copy link

Ok I added the background images and as always fixed some stuff too. We're setting up a video/audio meeting with Valeria to keep on with the integration.

I added the HEAP analytics tag, so I can follow how much people clicked on that button/saw this page.

@lapin7
Copy link
Contributor

lapin7 commented Jan 26, 2018

@Rafkraft is it possible to create a self service page for members that collects personal data? The idea is that members would be able to maintain their own data. See also
#203 O> Profile page for Member/Activists and KYC

@Rafkraft
Copy link

@lapin7

  • Sign up/sign in interface.
  • "my account" page/form with all the fields.
  • The back-end (database storing the users infos, an admin interface to see users's data). Is this what you describe, are there some other stuff/pages needed ??

@lapin7
Copy link
Contributor

lapin7 commented Jan 28, 2018

@Rafkraft
Exactly. A "My account page" with different sections in order to get the functionality for:

  • updating personal data
  • contracts and tax forms
  • reimbursement of expenses
  • overviews of work done
  • creating and sending invoices
  • joining conferences
  • providing links to useful work, video's or whatever

@makys
Copy link

makys commented Jan 28, 2018

@lapin7 are we considering appropriate security and privacy controls for storing personal data?

@makys makys self-assigned this Jan 28, 2018
@lapin7
Copy link
Contributor

lapin7 commented Jan 28, 2018

@makys
Of course appropriate security and privacy must be respected.
That mean access to that data is for:

  • the account self
  • some functional coop folks
  • no one else

@makys
Copy link

makys commented Jan 28, 2018

@lapin7 sounds good.
Maybe add encryption of data at the back end.
Develop a Privacy notice, so it is clear how the data will be used.

@Rafkraft
Copy link

Ok, I had some email conversations about member.rchain.coop , the backendwill be written in scala, I said that I don't have the skills for it, is there the same scala expectation for the backend of rchain.coop ?
If not I can code a Node js backend service or even link the front to a DB cloud platform like firebase

  • Comments on this / technical advices ??
  • Is it really necessary to encryt the database entries ? Rchain servers won't be secured enough ??

@kitblake
Copy link
Contributor

kitblake commented Jan 28, 2018 via email

@lapin7
Copy link
Contributor

lapin7 commented Jan 29, 2018

It's ridiculous to go on with Scala for website maintenance. Let's press for change to Node.js ASAP with @n10n and @leithaus

@lapin7
Copy link
Contributor

lapin7 commented Jan 29, 2018

@tet123 please send a msg to ops@rchain.coop in order to get access to documents

@Rafkraft
Copy link

Rafkraft commented Feb 7, 2018

Just to sum where we're at for rchain.coop:

  • The design is having its final modifications
  • We are still waiting from inputs from the coop to replace all the "Loreum ipsum" texts
  • Preview images for social medias will be ready soon :)
  • Still a lot a fake links ont the website (social media links in the bottom for example)
  • And then of course the other pages must be filled and integrated
  • When all the pages are ready, we'll see which language(s) must be added and we'll start working with the translators.

@patrick727
Copy link
Contributor Author

Thank you everyone for this wonderful input on the design process.

This is how we are going to proceed moving forward with branding/web design

  1. We are going to aggregate all of this feedback into a clear document of "community input"

  2. we are going to contract a branding/design firm in Seattle to help take this feedback, along with the input from our developing PR Narrative, RChain Holdings, Ventures, and Pyrofex to develop a congruent brand imagery that can span across all organizations.

  3. I've requested test instance's for all of the RChain sites moving forward so that we can demo what changes we would like to see as a community so that its simpler to get approval.

If there are better ideas please let me know.
I'm going to close down this issue for now just to clean things up.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
zz-Marketing guides: @pmoorman @AyAyRon-P @kitblake
Projects
None yet
Development

No branches or pull requests