Member.site theming and setup

[kitblake]

Describe how the building and implementation of this task will benefit the RChain Membership or the RChain blockchain:
The Wordpress instance where we're developing content for the member.site currently has a default theme. When it launches the site will need to look like RChain. As new branding is in the pipeline the design should simply follow existing house style, as used in rchain.coop and developer.rchain.coop, and not get too creative.

An existing Wordpress theme will be chosen and customized with RChain look&feel. This will be installed for review. Based on feedback from this issue's assignees, one or two iterations will be needed to fine tune the theme.

The theme will be created on a development server, with no content, then migrated to the member.site instance. Once installed, additional configuration will be needed such as installing certain plugins. Exactly how much work will be required is not clear yet.

As for midterm planning, the initial member.site will be an MVP. After it launches we'll collect feedback. Later, when the branding lands, we'll need to make content and style adjustments.

Estimated Budget of Task: $3600 (guesstimate, to be adjusted)
Estimated Timeline Required to Complete the Task: 2 weeks
Measure of Completion: New and approved theme is installed/configured on the member.site.

--
Legal
Task Submitter shall not submit Tasks that will involve RHOC being transacted in any manner that (i) jeopardizes RHOC’s status as a software access token or other relevant and applicable description of the RHOC as an “asset”—not a security— or (2) violates, in any manner, applicable U.S. Securities laws.

[kitblake]

@AyAyRon-P @makys @patrick727 @pmoorman @ian-bloom @dckc (Did I forget anybody?)
As part of a bounty system governance test, I'm inviting you to "assign" yourself to this issue (assuming you're actually interested). I could 'just do it' but assigning should be opt-in. Anybody else who's interested can opt-in too.

The idea is Github will preserve the assignees and then in the future it'll be easily and visually apparent who was a decision maker. This should overlap with the Budget/Reward system.

[PatrickM727]

I'm not a contributor anymore @lapin7 can you make me a collaborator to this repo so i can assigm myself and add labels x,y,z

[kitblake]

@PatrickM727 Looks like you're in, if so we can delete these messages.

[kitblake]

Here's a link to the theme development site (may load slowly):
http://rchain.maartenvandomburg.nl/

[kitblake]

These are comments already sent in an email, posted for the record:

HOME PAGE

Header

• Logo left in header: looks a little lonely. We could try one with "Cooperative" text. But let's wait and see.
• At some point Members may have a login, and then they'll have a profile menu, which will presumably be flush right in the header, as on other service sites. Could be the menu items will center then. Keep it in mind...
• Nice search widget.

Upper banner section

• I'll figure out the content.
• Would be good to center the logo (visually) vertically, but let's wait on content.

Benefits section

• The thumbs-up icons are still the old salmon color.
• Would be nice to have six different icons.

Video banner section

• Not sure about the scarlet background for the video. Kinda intense. Try a flat gray? Then we keep the scarlet as highlight color.

Call To Action section

• Looks fine, content TBD.

Footer

• Nice social icons. Could be a bit lighter.
• Currently we have: Twitter, Telegram, Reddit, Github, YouTube.
• We also have Medium, Facebook, LinkedIn.. but these are not needed.

LOWER PAGES

• These exist but design/theming is to be done.
• Is it possible to have different sidebars per site section? Thus different sidebar content in About, Get Involved, Membership, Support.

ToDo:

• Figure out (submenu) navigation for About and Membership pages.

[AyAyRon-P]

Hi @kitblake I just had an opportunity to read the above and will take a look shortly at the dev link and provide feedback

[kitblake]

@AyAyRon-P content is very much in progress

[Andrekuipers]

I just made the first version of the membership page, you can check the page via the navigation

[lapin7]

@Andrekuipers please fill out form:
RChain Active Member Registration
https://docs.google.com/forms/d/e/1FAIpQLSecwGUVFNx_Xa_Qsw5bxLnaKstPS8kQnfrUGqpuf22rLDteDg/viewform

[kitblake]

@Andrekuipers The Membership page looks good. That scarlet rule is subtle but strong.
If this is more or less a template for the subpages then we're on a good track.
More content to come..

[iamcoderisk]

I dont think it's advisable for a company that's still trying to stand while building its brand to develop its official website with WordPress. I can solve that problem using a framework and build the site from scratch in the space of two days if I am permitted.

[Andrekuipers]

Why not?

http://www.wpbeginner.com/why-you-should-use-wordpress/

[lapin7]

@iamcoderisk
please fill out form:
RChain Active Member Registration
https://docs.google.com/forms/d/e/1FAIpQLSecwGUVFNx_Xa_Qsw5bxLnaKstPS8kQnfrUGqpuf22rLDteDg/viewform

[PatrickM727]

Word press is what we are going with for right now.

If you can rapidly create something in another framework that proves it phenomenally better, do it.

If not, then lets continue focusing on how we can make the next iterations of this site better. @kitblake @Andrekuipers this is looking good.

What do you think next steps are?
What resources do you need(people, rhoc, authorization)

Lmk

[iamcoderisk]

Let me work on something...

[kitblake]

@PatrickM727 Right now @Ojimadu and I are working on content (for the MVP version) and tracking our progress in issue #595. Anybody else who wishes to contribute would be welcome! There's plenty to do, especially if you look beyond the MVP as visible in the latest outline in the GDoc:
https://docs.google.com/document/d/1JXM8k-fzf78Y_GbfkDdsekmdeVqqifC4VM0zEMBDxDw/edit

With @Andrekuipers' help we'll get all MVP pages laid out with content. Then we'll migrate everything to the rchain.me instance. That should happen next week (i.e. first full week of May).

Still an unknown is the KYC app. For now we're assuming it'll be a third party (thus external url) as described in #553. Or we live with the current one for awhile longer. I have no news about the payment status in #511 either.

When all is ready for prime time then we'll need to make infrastructure changes. But let's first push it along until it's done – and approved by all – before we start interacting with systems people. We have budgets in the B/R system which, barring unforeseen complications, should be sufficient. You could budget vote on the content and theming issues (login first).

In the meantime any critique from others would be welcome. Better now than later..

[dckc]

The theme looks like it's coming along well, but I wonder how much of the budget should be allocated to the April pay period. I'm putting in something, but probably not the whole $3600.

[Andrekuipers]

It was a busy weekend, I made all the pages with the content from the old site. Please let me know what you think.

[dckc]

Is there an important reason we can't all collaborate on the same WP instance? http://rchain.maartenvandomburg.nl/ seems pretty slow and unreliable. I'm struggling to see any of the work you did over the weekend.

I'd really like to see all the work done in https://coop-member-v1.rchain.me/ where many of us have access since Apr 2. (cf. #595, #446 )

[kitblake]

@dckc That's the plan:

With @Andrekuipers' help we'll get all MVP pages laid out with content. Then we'll migrate everything to the rchain.me instance. That should happen next week (i.e. first full week of May).

We'll try to get it done in the next days.

[Andrekuipers]

Yes Wednesday we will move the website to the https://coop-member-v1.rchain.me/
I made the website on my own server because I needed the content from the old website. Now that I have all the content we can migrate it to https://coop-member-v1.rchain.me/

[kitblake]

We have a blocker on the migration, @Andrekuipers needs database access. I've requested it from @ian-bloom and Jeremy Busk.

[Andrekuipers]

The new site is live on https://coop-member-v1.rchain.me :)

During the database migration the old Wordpress accounts were deleted, apologize. I don't know which person had an account, please let me or Kit know if if you need a new account on the new website.

[dckc]

Ah.. cool...

I had an account. I guess we'll get to scribbling in the same place soon; meanwhile...

I guess it's pretty, but I hope people are not coming here to watch a show but to get involved. This style where practically the only thing "above the fold" on the page is a big image seems like such a waste. I guess it's popular, but I don't know why.

Is it really important to have 145Kb of javascript too? performance measurements show the page takes 3 seconds to load! And it's over a megabyte.

[Andrekuipers]

The website is not optimized yet.. When the design is approved I will focus on optimizing the files for speed. Till then all the feedback is welcome!

[dckc]

I suppose you have an iterative approach in mind and that there aren't really "before approval" and "after approval" epochs. My approval of the design is heavily influenced by page weight, as noted.

[Andrekuipers]

Good to hear, I will focus on the page speed and minimize the javascript!

[dckc]

Oh... also... "Coop Membership Benefits, Coop Membership Benefits ..." is basically lorem ipsum, right? I'm not the sort of reviewer who can judge the page independent of the copy, so I'm standing by until the real copy is there -- at least the copy that was hashed out a few weeks ago.

[Andrekuipers]

Yes that's right. I think Kit will fill in the content @kitblake ?

[kitblake]

Yes, @Ojimadu and I are working on content (in issue #595).

[kitblake]

My approval of the design is heavily influenced by page weight, as noted.

@dckc I nodded when I saw your comment. However, the paradigm has shifted (as Nielsen also noted). It's ok to scroll, in fact it's preferred to waiting for successive page loads. Every crypto site I know is an SPA (Single Page Application).

A while back I was involved in a project and pushing for cramming more content 'above the fold'. The designer shot me a look and said, "Is it so much effort to hit your space bar?". That was when I learned to appreciate SPAs, where a complicated application loads in the background, but there's no waiting. Once it's in, you have instant gratification. And shift-space takes you back up!

Here's a telling comparison, and it's a frenemy of ours: https://universa.io/
Load time: 8.74 seconds. But you see stuff above the fold right away.
Bytes in: 2.346 megabytes. It loads in the background.
This SPA has 11 sections.

Also let me point out that, from my location at least, our WP instance has never been fast. There's probably infrastructural optimization we can do too. But first the MVP.

[kitblake]

Thanks to Jeremy Busk, we now have email integration into the WP instance, and people will be receiving invites.

[pmoorman]

@kitblake what does the email integration integrate with? Which tool do you use for the emailing? (curious because of #219)

[kitblake]

@pmoorman
jeremybusk - Hier à 18:04
Kit, email relay works now from coop-member-v1. I installed the Easy WP SMTP plugin and added in relay parameters.

It's relaying to rchain.me.

[kitblake]

Here is a provisional list of theming ToDo's for the Member site. Feel free to add your own.
Content contributions are welcome too (but discussion of content goes in #595).

Header

• Let's try the RChain logo with Cooperative: https://github.com/rchain/style_guide_and_files/blob/master/web/Rchain_brand_scarlet_horiz.png

• The site needs OG tags in the head. For now og:image and twitter:image should default to a non-transparent RChain logo.

• The About section will have subpages and we need to get submenus in the nav working.

• We need a plugin for a Calendar. Config is already sent. Calendar is a top level nav item.

Pages

• Subpages require a sectioned layout.

Footer

• The copyright should read "Copyright © 2018 RChain Cooperative".
• Social media icons: need links. To add: Telegram, Reddit, Github icons.

Optimizations

• On Home in mobile format, is there a way to get the CTA buttons to fall below the right-side elements?
• The search results page has a default WP sidebar.
• The copyright in the footer should render the year with php or js:
  https://designshack.net/articles/the-footer-copyright-notice/

[pmoorman]

@kitblake I could help with content

[dckc]

The site needs OG tags in the head.

"needs" is a strong word. In what sense is our MVP critically incomplete without OG tags? Which of our use cases won't work without it?

The About section will have subpages and we need to get submenus in the nav working.

In our March 24 MVP, I don't see anything regarding subpages for About. submenus makes me nervous... I guess I should look into this further.

[kitblake]

OG tags are a Must have because they make sharing the URL on social media much more appealing.

@dckc I'll demonstrate the difference in Discord (which renders rich previews like Twitter, Telegram, etc. do).

Edit: Dan has rich previews in Discord turned off. Figures. The guy just isn't social.

[dckc]

I don't see "nice rendering when shared via social media" among any of our MVP requirements.

I don't doubt it's nice to have, and as long as it doesn't slow things down, now is as good a time as any to add it. But take care with that word "need".

[kitblake]

Progress:

• The Calendar is setup. Not the prettiest colorwise but fine for an MVP.
• The OpenGraph and Twitter tags are working.
• Configured OG component per page.
• All the subpages have layout now.

Some ToDo's before going live (not necessarily an exhaustive list):

• Change footer and include social icons
• Check mobile responsive
• Optimize page speed

[kitblake]

OpenGraph tags have been configured for all pages.

[kitblake]

We're making some last little layout fixes..

[Andrekuipers]

Footer changes with social icons, making the website responsive is done :)

Optimize page speed will be done when the website is migrated to the new domain.

[AyAyRon-P]

@kitblake @Andrekuipers

Are there any updates to this project? Do we need to add anything or can we close this out and archive the links in the issue?

[kitblake]

It's blocked. See #595 (comment)
Once it goes live on the correct subdomain @Andrekuipers needs to do some speed optimization. Then we'll close this issue.

[pmoorman]

@kitblake any news here?