search

rchain / bounties

RChain Bounty Program
MIT License
90 stars 59 forks source link

4 Week UI/UX Mock Ups #446

Closed patrick727 closed 6 years ago

patrick727 commented 6 years ago

Lets take the feedback from issue #400 and use it to inform mock ups for the member website

current mock-up:

We used Dan's office hours (#403) Saturdays 9am Chicago time a couple times (17 Mar, 24 Mar) to discuss this and other member-site issues. It's a pattern that seems likely to continue.

earlier discussion documents: Governance Document

Member service portal

AyAyRon-P commented 6 years ago

@patrick727 @pmoorman @kitblake - based on the Governance Document above, please see the attached sitemap for review.
rchain_member site

makys commented 6 years ago

Is there a meeting to discuss the UI/UX mock ups? If yes, please share meeting info.

ResonanceXX commented 6 years ago

Share meeting info. Zoom always. 

Sent from Yahoo Mail on Android

kitblake commented 6 years ago

@AyAyRon-P Nice work on the sitemap. It captures all of the points in the Gov Doc above and can serve as a long term view. We should also refine a short term view which would comprise the structure and content we want to have at launch, with more to be added over time.

Note that "Deals" is in pink in the Gov Doc. Personally I'm not sure it belongs here (but it's important that it's available somewhere).

The top level navigation in the site map includes:

That's a lotta top level links, we could consider merging or removing some, but I won't go into that now. It's nice to have the visualization.

kitblake commented 6 years ago

In the #exec-committee meeting on March 3rd it was affirmed that the Members Portal WG has the mandate to create a structure for the future site. @ian-bloom has the lead as the site will replace the current critical infrastructure in members.rchain.coop.

The question "What is the site for?" came up. My answer is: “member.rchain.coop is the gateway to getting involved”, but that's for the WG to nail down.

AyAyRon-P commented 6 years ago

@kitblake do you have time for a chat and we can add some color to the sitemap for hierarchy and timeline of development.

patrick727 commented 6 years ago

Great stuff with sitemap Aaron.

Would all of that fit into something like this member website

kitblake commented 6 years ago

Having only 5 items in the (initial) top level navigation is sensible.

This is what @patrick727's site map looks like in text. Things in italics are future items, not necessarily included for launch (once this coalesces we should MoSCoW these items to plan for the launch). I added one item in bold that comes from @AyAyRon-P's site map, with the idea that most, if not all, should be added.

As @AyAyRon-P said, it would be good to make color coded site map diagrams. But let's first agree on an outline structure, otherwise the mappers will spend a lot of time revamping diagrams.

Please either edit this message directly, or edit and copy the indent code for a new post, to make a revised structure.

@patrick727 what are you thinking about for the chat? Yet another chat app? A special chat for onboarding? I'd rather make a 'gangplank' channel in Discord for newbies and onboarding.

makys commented 6 years ago

I looked through the suggestions and this is what I came up with:

# About • Bylaws • Principles & Values • Deals • Contact US # Membership • Benefits of Membership • Onboarding • How to Contribute o Channels o Committee o Working Groups o Voting o Petition • News o Monthly Newsletter o Blog and Media o Roadmap Tracker • FAQ • Open Positions # Profile • Update Profile • Set Preferences • Change Password # Events • Meet Ups • Upcoming Interview • Date & Project Calendar

This is not the best of formatting to create a better visual. See attached for better visual. UIUX Mockup.docx

AyAyRon-P commented 6 years ago

@patrick727 Yes I can create a more vertical sitemap if we need to but my recommendation is still to add color to show particular segments of the navigation.

@kitblake I agree with your outline structure I think that cleans up much of what was in question as far as what is needed/wanted/nice-to-have. It would be good to use some of the sub-cats from @makys in your structure. What I like about yours is the naming - it's navigation on a more relaxed level using terms like "GET INVOLVED" and "ECOSYSTEM"

@kitblake when you say "CHAT" do you mean a bot? Or do you mean a direct message link to someone? I think your recommendation to join a discord channel would be more functional and makes more sense to drive the interested party to discord for communication.

Once we have consensus on the MAIN CATEGORIES we can then worry about flushing out the sub categories and at that point I will update the site map.

patrick727 commented 6 years ago

I agree, but I think the sub categories are what will define the main categories

@kitblake for chat, greg mentioned if it would make sense to have a members only discord again, and I added that this should be a chat instance in the member site, so this chat could be an integrated discord instance or mattermost if we want to go with that.

kitblake commented 6 years ago

Ok @patrick727, an integrated chat (of a Discord or Mattermost channel) would be cool. No duplication.

kitblake commented 6 years ago

Eek, a proprietary doc format! :) @makys I appended your outline to the Member Service Portal doc: https://docs.google.com/document/d/1JXM8k-fzf78Y_GbfkDdsekmdeVqqifC4VM0zEMBDxDw/edit# Why don't we all collaborate there.

patrick727 commented 6 years ago

Anyone on here have experience with wordpress?

Looking for help mocking up this in a wordpress test instance

AyAyRon-P commented 6 years ago

@patrick727 I have some experience - do you have an account?

patrick727 commented 6 years ago

@AyAyRon-P cool i just made you an editor of the test instance Tomorrow i'm suppose to be meeting with a friend to play around with the instance so let me know if you plan on making any editing.

dckc commented 6 years ago

Someone called Chiamaka Igweka in gdocs added this to this week's agenda (#469). I'm interested to know why. Just FYI? Or is this issue stuck? What's the goal of the agenda item?

@Tonyprisca13 do you know that person?

dckc commented 6 years ago

I see people referring to this issue from discord discussion, so I suppose it's important to note that @patrick727 has handed the lead over to @ian-bloom (for a time, at least).

@ian-bloom are you still inclined to follow the approach in this issue?

ian-bloom commented 6 years ago

@dckc Yes. I'm mostly in accord. Since WordPress is flexible, and member.rchain.coop will be inward facing (like an intranet) I'm not overly concerned about getting the navigation hierarchy right on day one. We can play and iterate.

My biggest concerns for the site are:

  1. Revamping member-DB, Registration, Payment, ID-Verification
  2. Authentication of Members (Discord to WP via OAuth+BOT) as in #413
  3. Hiring a Communications Lead who is an excellent writer, to have editorial authority over Co-op channels. (rchain.coop , member.rchain.coop , Newsletter , Announcements)
  4. Using only WP Plugins and Themes that are most necessary and secure.
dckc commented 6 years ago
  1. "revamping" in what way? What goals / requirements do you want to achieve that are not currently in place? Tell me a story about the world where it's working?
  2. Authenticating for what privileges?
  3. Surely hiring a comm lead is out of scope of this issue.
  4. I'm still struggling to figure out where WP fits in, actually. For example, are we sure that a collection of static pages doesn't suffice?
dckc commented 6 years ago

Several of us discussed member-site stuff today as part of my weekly office hours #403.

Non-USD membership payments

current arrangement lasts only thru Apr 24

Member database

@ian-bloom has been advised to migrate the membership DB to LDAP. All of us concur it's an industry best practice. (#513)

Member profiles

e.g.

(LDAP attribute? Wordpress profile field? drupal profile field?)

New member ID Photo process

photo process is incomplete (#515)

Scalable ID verification (KYC)

JK observed a possibility of 20K sign-ups by end of year... maybe 200 per day? outsource? scale up in-house? @AyAyRon-P recently went through several KYC processes with features we would do well to adopt. He also noted "some of the more common issues ... moderating the telegram channel: the KYC process for membership especially with regards to document uploading" https://github.com/rchain/bounties/issues/291#issuecomment-369296566

Collaborative Editing among members

no specific actions on this so far...

why wp? drupal? many hands... blog FAQ - dynamic

WP - discord - does https://wordpress.org/plugins/wp-discord/ do roles?

@ICA3DaR5 advocated git + markdown, or drupal over wordpress for efficiency.

makys commented 6 years ago

@dckc what meeting is this?

dckc commented 6 years ago

@makys it was part of my weekly office hours #403

kitblake commented 6 years ago

This issue has been hijacked by technical implementation discussion. Of course, one could also say that it wasn't exactly SMART to begin with, but the "UI/UX Mock Ups" in the title have nothing to do with payment processors, using LDAP, or scalable ID verification.

@dckc has spun off the implementation level issues and left the focus on Collaborative Editing among members, which is also implementation, so I've spun that off into #521.

Returning to the content-focused intention of the original issue. I'd like to restore that focus. People should work out – and then work on – what the content of the member site could be. (That content has nothing to do with whatever system we choose to serve it with.)

In the antecedent to this issue, #400, @pmoorman wrote: "Problem definition :: I would suggest — preceding the listing of features — that we outline which specific problems we're actually aiming to solve for members. It might be that certain solutions/features can be replaced by other features that would for instance be easier."

Above, the question "What is the site for?" came up. My answer is: “member.rchain.coop is the gateway to getting involved”, but that's for the WG to nail down.

This is still my thinking. When a new Member wants to get oriented, going to member.rchain.coop should provide all the answers. So the focus is on getting new Members up and running.

There is another basic use case, for Members who have been Members for awhile, where we could say that the Member site serves as an Intranet for existing Members. Imho those aspects should be contained in the site as well, but they can be deeper in the content hierarchy, and the site's main purpose remains "the gateway to getting involved" with RChain.

kitblake commented 6 years ago

Currently, we have three site maps:

  1. One, created by @AyAyRon-P, is longer term and based on the "governance strategy - member website proposal feedback #400"
  2. @patrick727 created a simple short term site map above at https://github.com/rchain/bounties/issues/446#issuecomment-370584337
  3. @makys contributed an outline sitemap above, which now lives in the GDoc to make it group editable. https://docs.google.com/document/d/1JXM8k-fzf78Y_GbfkDdsekmdeVqqifC4VM0zEMBDxDw/edit

I've created an updated version of @makys's outline in the GDoc. Please have a look and edit away or copy and modify your own.

Note that the content hierarchy will certainly change, and probably a lot, but this gives us enough to start mockups and give the site some visual form.

dckc commented 6 years ago

I suggested to @patrick727 and to @ian-bloom the use of Google Slides as a mock-up tool. I still think it's a good idea, so I started:

So far, I just mocked up the current pages for reference / criticism.

dckc commented 6 years ago

@kitblake writes:

Returning to the content-focused intention of the original issue. I'd like to restore that focus.

Yes, let's. But...

But let's first agree on an outline structure ...

I suggest before that we focus on what tasks we expect our users to be able to do.

Here are some tasks that come to mind, in no particular order; some of these are currently well-served and some are not; some may be out of scope of the member site:

kitblake commented 6 years ago

@dckc That's a nice list, but shouldn't it become it's own issue? Then we can do the whole AListApart process, culminating in a Loomio survey for Members about what were their top 5 tasks when first investigating the coop.

dckc commented 6 years ago

I could make it a separate issue, but then I would wonder what to do with this one. I would prefer to change the title of this one to something like "member site user stories / tasks".

I'll just keep saying it over and over: story telling and test cases. Note that these stories / tasks naturally evolve into tests in two ways:

  1. user testing: give some users the task of finding the list of membership benefits and see whether they can
  2. software testing: automated tests (using selenium webdriver or the like) for ensuring that the web site behaves as designed
patrick727 commented 6 years ago

@dckc I love the idea of using google slides.

I looked back in my email about "taking the lead." I was intending to have someone take the lead on the mockups. Not necessarily the entire process but this stage.

That was my fault by wording it weirdly in a rush...

beside the google slides, is there anyone directly taking ownership of mockups? i'm going to talk with @Jake-Gillberg 's reference Ed Silva today about this.

patrick727 commented 6 years ago

Update!

  1. Changed this headline to 4 week ui/ux mockups to give us a bit more time. I propose we set a hard deadline for the short/mid term nav for 03/28/2018

  2. Just got off of a call with Ed Silva, a developer from from livelygig. He is available to help create a test website. He will send me a doc with his thoughts and expectations for involvment to share with @ian-bloom and others before the staff meeting friday.

  3. I'm working on an independent verzion of google slides to present the navigation I believe should be. I'm doing this independent of @dckc because my hopes are that whoever has ideas for nav can whip up there own swiftly and we can compare thoughts, with that being said, mine does consider the work down in the member site doc by @kitblake and @makys.

I hope to share by tomorrow night, pending other obligations.

dckc commented 6 years ago

I looked back in my email about "taking the lead." I was intending to have someone take the lead on the mockups. Not necessarily the entire process but this stage.

Cool; meanwhile, @kitblake asked the executive committee whether anyone has mandate to go beyond mock-ups and actually change member.rchain.coop; the result was:

RESOLVED: to grant Ian Bloom authority to lead work on member.rchain.coop evolution -- March 2 minutes

It's not likely to matter much who has what official role, as long as we're all working together. But working together means stuff like answering Ian's March 15 "we should meet soon" message. Maybe you already did; I guess I was only blind-copied, so a reply wouldn't naturally go to me. But as of yesterday, It looked like Ian hadn't gotten a reply.

If you want to include me when you meet, the most convenient time is my RChain office hours Saturdays 9am Chicago time (#403). But I could perhaps meet other times.

kitblake commented 6 years ago

Sorry to nitpick @dckc, but there's an incorrect word – 'anyone' – in your quote of the meeting minutes:

"...meanwhile, @kitblake asked the executive committee whether the [Member Site Working Group] has mandate to go beyond mock-ups and actually change member.rchain.coop"

The answer was: "provided they work with Ian, yes."

So it was "RESOLVED..."

To clarify, it's the Working Group that got the mandate.

(This is probably inconsequential. But words work.)

dckc commented 6 years ago

Notes on this issue from today's 20180321 RAM meeting (#518) end with:

Patrick: Currently there is no next or weekly meeting for the WG. kitblake: Let’s fix that.

So... did anybody take the ball to fix it? The records don't show it. If not, that's a real missed opportunity. I'm inclined to reduce the budget of those meetings if they're not effective at keeping balls moving.

My office hours (Saturdays 9am Chicago time #403) worked pretty well last week. Until something better comes along, I recommend using that.

Also:

Patrick: I’m doing Google Slide mockups, will share the slides asap.

ASAP = as soon as possible. It's possible to share the slides (finished or not) already, no? So ASAP wasn't meant literally. What time-frame was intended, @patrick727 ?

kitblake commented 6 years ago

Doing double duty, I made a Loomio "Ranked Choice" poll in order to collect input for the Member Site content and simultaneously test out Loomio.

The ranking follows thru on the AListApart technique of defining tasks and then collecting user priorities. See @dckc's list above in https://github.com/rchain/bounties/issues/446#issuecomment-374302272

19 members have been invited to test out the Loomio instance and I assume all 19 have received an email invitation to fill out the Ranked Choice poll. But anybody is welcome to join: https://www.loomio.org/invitations/33d924be03c1cd7eddc6

(Creating the poll was easy, seamless and intuitive. I really like Loomio! When I use their software it feels 'fully formed', meaning it's been thought thru, put thru its paces, optimized, and it harbors a wealth of invisible decisions. The Coop would really benefit from adopting all they've done. But in order to keep this issue on topic, I'm appending the comment to the ongoing Loomio discussion in #380.)

patrick727 commented 6 years ago

@dckc ... see my comment from two days ago

Goal for slides was last night, missed it but here they are Goal for member feedback on nav is 3/28.

Pats google slide

@kitblake I agree on the loomio thing, you already know and I already shared most of my secret plan for that yesterday lol.

Maybe in dan's office hours we can walk through the slides and give feedback? Seems like a productive use of the time.

dckc commented 6 years ago

Ohh! nice quick-n-dirty mock-up, @patrick727 . I only looked at it for a few seconds...

One concern:

I wonder how to do that. Are you thinking of using frames? I have a visceral distaste for frames. Maybe not constructive.

On rewards.rchain.coop we can add navigational elements shared with member.rchain.coop; but I don't see how to do that with loomio nor discord.

dckc commented 6 years ago

Another suggestion: avoid User0. Think in terms of real personas (cf #81) and give them names. Or even real persons; use Dan if you like :)

patrick727 commented 6 years ago

@dckc I will update the profile based on your persona input. Fair point.

@eedsilva can speak more on how to integrate loomio and discord as hes going to be taking the mockups to the next phase.

Dan it is!

kitblake commented 6 years ago

Nice wireframes @patrick727, you're really putting Google Slides to good work.

The main question for me is why is most of the information cached behind a registration/paywall? Afaik all of the info is already public.

For example, in order to decide about joining the Co-op, a non-user might like to see the Calendar, read about Working Groups, Proposals & Voting, the Reward Program, etc. All that is hidden right now.

Another point is, once the user completes registration, there's a content hierarchy with [Profile] as the root (top level nav). In most services, like this Github repository, Profile is in the upper right corner and offers profile editing and maybe settings, but not content navigation.

I think you could easily move the content hierarchies that you've created into the public space that a non-user sees. There's plenty of room in the navigation bar (e.g. logout goes under Profile). Also currently the About menu disappears after a user logs in.

pmoorman commented 6 years ago

@dckc @patrick727 @ian-bloom

Just spoke with Dan, and we touched on the membership portal.

One of the conclusions that we arrived at, was that it's worth considering how all kind of projects can be structured in smaller scopes, rather than big "all-or-nothing" updates.

The member portal project seemed like an excellent example.

Two suggestions to consider...

  1. Onboarding now, governance later :: We could first focus only on the onboarding-related stuff (= smaller scope), and only once we've executed that, do the governance-related things.

  2. Email-based onboarding :: To improve the onboarding, we could maybe suffice with an email-heavy kind of approach, rather than actually coding up any new functionality.

The email-based kind of thing is a bit too complicated to explain here maybe... but with smart use of email marketing automation, we could really give people a very smooth onboarding experience where we wouldn't leave them hanging.

Going email-heavy has a few distinct benefits:

The next question is... should we use a fully self-hosted email marketing solution, or do we us a tool on the market?

@dckc is a strong advocate of the former (as you would expect)...

In principle I'm in favor of it, too... but I'm sceptical about whether it'll actually work.

We quickly reviewed a list of WordPress plugins, but they're just bridges to get your subscribers quickly into a 3rd-party email marketing vendor. That's not what we want.

So can we do self-hosted...?

Google shows that there are a few self-hosted email automation solutions though. Here's a nice overview: https://geekflare.com/self-hosted-marketing-email/

I checked out the top 5, but none of them have the functionality I'd be looking for (= a way to track events like "Dan has uploaded his passport", and a way to send emails based on that event: "Hey Dan, let's schedule a call for KYC verification")

My suggestions regarding hosted email marketing providers can be found in Github Issue #219 (summary: I'd recommend we use Drip).

Anyway.... something to consider!

P.S. It's getting late here, but Dan can hopefully help me out if I made massive omissions or monstrous errors in my write-up regarding what we talked about.

dckc commented 6 years ago

We could first focus only on the onboarding-related stuff ...

OK, so what list of tasks does that suggest? "read architecture document" was a huge part of onboarding, for me, but is it part of what you have in mind? How about "find a first coding issue to work on"? Are folks onboarded when we have their $20 or when they are productively engaged?

pmoorman commented 6 years ago

We could start with the most basic stuff (e.g. leave email => pay => passport => Discord => KYC => Github) or something like that. Once we have that, we can widen the scope to include more and more stuff.

End-goal is either "productively engaged" or (better yet) "so enthusiastic they tell their friends about it"

patrick727 commented 6 years ago

Do we actually know what is "small" scope and what is not?

Hopefully in our meeting soon we talk through some of the requirements for implementing this navigation in an M.V.P like manner.

it's important to remebmer the demand from the governance forum was for better communications/collaboration tools.

Fluid member onboarding does play into that as well. @ian-bloom and I on a call yesterday thought through an M.V.P in wordpress could look like.

Registration/sign in - member onboarding Wiki - information indexing, including "how to get involved" like posts Calendar - Share events

and then we can build out features from there.

@kitblake great point in regards to the pre-registration nav and post registration nav. The wiki & calendar could definitely sit pre-registration. But I think proposals & voting should be behind an authentication wall. Thoughts?

dckc commented 6 years ago

... proposals & voting should be behind an authentication wall

No.

Not if you want my participation, anyway.

If I can't share it (e.g. link to it) freely with all the communities I work in, I'm not going to put my effort there.

patrick727 commented 6 years ago

It's important to keep in mind this solution is an attempt to be the interim solution before an RChain based solution goes live.

Not an interim of an interim solution. Not saying "all or nothing" but it definitely should be used to solve most of the problems highlighted in the governance forum and in the service doc.

We can/should contract help to develop so difficulty to development would be less of a critical factor if we can hire the help to do it.

The most important factor to me is UX and if there is a small scope, it should flow alot like the large scope so as to keep consistency and avoid losing members engagement by requiring to many behavior changes.

patrick727 commented 6 years ago

@dckc i should have said specifically for member related votes.

Like if we wanted to answer the question "what do members think of this"

dckc commented 6 years ago

Not an interim of an interim solution.

You think we're going to get even an interim solution right the first time?

Surely an incremental approach is the way to go.

patrick727 commented 6 years ago

I think we can approach "good enough" quickly yes for most of the proposed navigation pieces.

I guess i should have framed it as this question "what parts of what you called "all or nothing" approach should be left out and why?"

That'll help me understand the specifics.

dckc commented 6 years ago

@patrick727 , @pmoorman , @ian-bloom and I talked this stuff over. We used Pats take on member.rchain.coop to capture the results. After about 8 slides is an MVP dividing line; the stuff below that is "nice to have", at least for the next week or so.

Jeremy spun up a coop-member-v1 wordpress instance for Patrick a little while back; Ian is to arrange access for Dan and Pieter. By the end of the month, we should know more about some technical details behind the existing member.rchain.coop set-up. Migrating to LDAP (#513) is still the plan.

We agreed to put a page including benefits of membership (#520) between the Join Membership link on the coop homepage and the "enter your registration details" page. And a calendar seems cost-effective. For now, the rest would just be a page of links or some such.

For follow-up on Email-based onboarding, see #219 where @pmoorman has the ball to put together something that Dan and Ian can perhaps take to the executive committee.