saxifrage / cityasacampus

An open-source platform for connecting and showcasing resources within local learning communities.
http://cityasacampus.org/
5 stars 4 forks source link

Dashboard Theme #205

Open MatthewVita opened 8 years ago

MatthewVita commented 8 years ago

make sure the RoR dashboard theme is extremely similar to that of our regular webapp.

MatthewVita commented 8 years ago

first pass :) needs a lot of work but at least rails dashboard side is wired up a bit better now!

@timothyfcook look how beautiful:

1 2 3 4 5

timothyfcook commented 8 years ago

oooo pretty! 100x improvement. Time for @cameronscott137 and @chelseaerdner and @dmtroyer to do some magic and bring it home.

Remember, we want to have a place where you can build maps as well. I'll make a new ticket for thinking about what this looks like...

MatthewVita commented 8 years ago

yep. still a lot of work to be done!

chelseaerdner commented 8 years ago

Hello everyone,

So I took a pass at styling these pages and creating a sitemap to confirm that my understanding of this flow is correct. Steve and Matthew gave me access to see what was going on and I want to confirm some things.

Here is the flow I mapped out. From the homepage, a user can explore opportunities, join now, or login. The user only have to create an account once therefore, only identifying if they are a learner or organization one time. After that, they simply login with the credentials they created.

If a user that does not have an account is exploring opportunities and wants to participate in one, they can click register but it will just redirect them to the signup page. From there they will choose Organizer or Learner and create and account.

screen shot 2015-10-28 at 12 35 19 pm

Moving on from that...I styled some of the screen Matthew posted above.

Here is the first screen a user sees when creating and account:

screen shot 2015-10-28 at 12 51 55 pm

If they chose organizer, this is what they would see:

screen shot 2015-10-28 at 12 53 03 pm

If they chose learner, this is what they would see:

screen shot 2015-10-28 at 12 54 27 pm

If a user already has an account and choses to login this is what they would see:

screen shot 2015-10-28 at 12 55 20 pm

I am going to working on the individual dashboard screens now. Although, I am lack context into some of it. I will reach out if I run into any issues.

As for the screens above, let me know thoughts and opinions.

Thanks! Chelsea

dmtroyer commented 8 years ago

Wow, I think the styling looks great!

I think there are aspects of the admin dashboard that probably need a bit more thought than styling what is currently there. For example:

@timothyfcook were you hoping to discuss some of this on Friday?

chelseaerdner commented 8 years ago

Thanks, @dmtroyer!

Makes sense though, I will hold off until our conversation Friday to move forward.

MatthewVita commented 8 years ago

Github doesn't allow for 2 people to be assigned to an issue, but consider Chelsea and David the assignees for this. I put this in the "Nov. 3rd Demo Epic" milestone, but that doesn't mean it must be completed by then. Just try to get as much done as you can.

@timothyfcook, do you agree?

timothyfcook commented 8 years ago

Definitely. We'll finalize the design on Friday and then lean on @cameronscott137 to implement. We very well might have it done before the Nov. 3rd deadline.

dmtroyer commented 8 years ago

Some brainstorming thoughts from @timothyfcook and I:

timothyfcook commented 8 years ago

Great chat IRL with @chelseaerdner today. Next steps are for her to:

Note: we talked about using a variable for tenant_name in every place where "Learn.Pgh" would show up so that future tenants can easily change them via a config file or Super Admin dashboard, depending on what we decide for #285

dmtroyer commented 8 years ago

I made an issue to start enumerating tenant-specific config on #316

chelseaerdner commented 8 years ago

Happy Friday everyone,

I wanted to share my progress with the team in regards to the revisions to onboarding and the admin dashboard pages this week.

Onboarding Flow: Last week we determined that an organizer needs to identify themselves as an individual organizer or one that is associated with an organization. Individual organizers provide a little information about their work. Organization organizers can either join an existing org or create a new one. The first user to create an organization is automatically the admin of that organization and all other users associated with it are "organizers."

caac_admin_11062015-04

caac_admin_11062015-07

caac_admin_11062015-08

Admin Dashboard: There are a lot of things to think about with the admin dashboard screens but I started to flush out the different aspects a user sees when first logging in and landing on their dashboard. I think the 5 buckets are: Overview, Opportunities, Locations (or Venues), Organizers, and Settings. The screens below are just the high level views of: Opportunities, Locations, and Organizers. I am still working through the rest early next week. I just saw the issue about replacing Locations with Venues and I will incorporate that next week also.

caac_admin_11062015-10

caac_admin_11062015-09

caac_admin_11062015-12

There is a lot to look at here so please let me know if I can clarify any questions or issues that come up!

Thanks!

chelseaerdner commented 8 years ago

Also, I briefly spoke with @sdanko11 about using another word for instances within an opportunity. I think that the word instances is a little too technical for the users within orgs. Does anyone have a user friendly suggestion to replace it on the front-end? Steve and I were thinking something like...occasions or occurrences? Basically we need a word that displays there are multiple events within an opportunity.

dmtroyer commented 8 years ago

+1 on thinking of another word for opportunity instances.

This seems like a good time to consider moving the admin dashboard from the rails app to the angular app. There are certainly costs associated with that move which need to be weighed against the cost of maintaining these separately when they really seem to be converging. cc: @MatthewVita @sdanko11 @cameronscott137 @timothyfcook @whit537

MatthewVita commented 8 years ago

@chelseaerdner the mockups look wonderful.

@dmtroyer https://github.com/saxifrage/cityasacampus/issues/342

chelseaerdner commented 8 years ago

@MatthewVita Thank you! I will post more progress as I complete it this week.

dmtroyer commented 8 years ago

So what's the strategy for moving forward with this in light of decisions and findings on #342 and #344? @timothyfcook suggested @cameronscott137 and myself pairing, which him doing the frontend (angular) and me doing the backend (rails).

If we break it out into user stories/issues/prs by feature, I think that could be a good way to start? I think a first candidate could be user registration, and we have mockups for that!

MatthewVita commented 8 years ago

@dmtroyer I've created https://github.com/saxifrage/cityasacampus/issues/347 for this since both ends have to be developed in tandem. I can join in on this as well!

@timothyfcook: note that Angularizing the dashboard is really a technical debt item that is non-trivial. Also note if we jump on it now, we're not following the currently roadmap properly:

capture

We are currently around the red arrow. The blue arrow represents where we handle the bulk of our technical debt (such as this).

tl;dr: I love improving our stack as much as everyone else does but we are all responsible for following our roadmap appropriately. You'll need to decide if we should stick to the current roadmap or adjust it.

dmtroyer commented 8 years ago

@MatthewVita thank you for pointing this out re: the road map. I think this is really critical for a project such as this where individuals are distributed but trying to work towards the same goal.

I also think it is necessary to weigh that by implementing the proposed improvements to the admin ui in rails, we will incur even further technical debt and it would make angularizing the admin side of things even more costly and less worthwhile down the line. There's a whole lot of work to be done for the admin ui either way, but I agree this should be considered out of step with the roadmap in some sense.

MatthewVita commented 8 years ago

@dmtroyer I totally agree! I'm just being a big stickler about the roadmap and it's ultimately up to Tim to decide priorities with it.

📈📊📈📊📈📊

timothyfcook commented 8 years ago

Great conversation, thanks for raising this.

I agree that we shouldn't pursue tech debt issues unless really necessary for the MVP.

The main question to help decide this is:

Thoughts?

dmtroyer commented 8 years ago

Can we adequately create an Admin UI that we feel good about for the MVP launch without moving the Admin side over to Angular? I'm fine with leaving it, but also don't want to waste resources on a Rails Admin UI if we are just going to move it later.

@MatthewVita and @cameronscott137 might have a better idea of this, but my gut feeling is that it would be doable but ugly (keeping it in rails). My main concern is how we would go about maintaining the unified user experience, like the headers and navigation, in what @chelseaerdner is cooking up. Maybe we could add an iframe to the rails views inside the angular views or just duplicate it and maintain them separately.

In all, I feel that It would save us some time now in that we wouldn't have to implement token auth and the necessary rails side web services, but we're creating an order of magnitude more tech debt by doing it in rails now if we ever want to move it to angular in the future.

MatthewVita commented 8 years ago

From a technical perspective: what @dmtroyer said.

From a planning perspective: we've already scoped out tech debt on our roadmap for post-MVP mainly in terms of adding unit tests and creating great documentation (filter against "tech debt" label in our issues). Do we add Angular dashboard tech debt to that list or tackle it now? It will delay the MVP a bit (not for a bad reason, of course).

From a project perspective, the sole purpose of the MVP is to quickly*\ get it in front of educators/learners/cities/non-profits to see if our platform provides value and if we need to pivot based off of that feedback. I'm sure we didn't get everything right with this first iteration and that's okay. Worst case scenario is that we do pivot and the technical investment in the MVP dashboard was all for nothing.

*\ I hate this word, but you know what I mean. I'm touching on the "fail fast" model.

dmtroyer commented 8 years ago

::nudge::

MatthewVita commented 8 years ago

:grey_question:

dmtroyer commented 8 years ago

I believe @timothyfcook is somewhere in the throws of having a baby! :baby_symbol:

MatthewVita commented 8 years ago

Okay, @whit537, @dmtroyer, @sdanko11, and @cameronscott137. Since @timothyfcook is out (https://github.com/saxifrage/cityasacampus/issues/353#issuecomment-159279918), let's make an executive decision (via a vote) so we can move things forward. Just edit the following comment with your vote:

MatthewVita commented 8 years ago

Should we move forward with the Angular dashboard to have a more robust solution or stick with Rails serving up the client to get the MVP done quicker?

NAME VOTE (angular/rails)
Matthew angular
David angular
Cameron null
Steve null
Chad angular

EDIT: oops, how could I forget to add Chad!?

dmtroyer commented 8 years ago

@chelseaerdner could we get some assets of the icons (svgs?) from your work in https://github.com/saxifrage/cityasacampus/issues/205#issuecomment-154440422? Thanks.

chadwhitacre commented 8 years ago

EDIT: oops, how could I forget to add Chad!?

@MatthewVita :-)

Happy to follow along with Angular if you and @dmtroyer wanna lead the charge. New territory for me. :-)

MatthewVita commented 8 years ago

Great. @dmtroyer, @whit537: Let's be very disciplined about making small user/technical stories in https://github.com/saxifrage/cityasacampus/milestones/Angularize%20Admin%20Dashboard%20Epic so we don't step on each other's feet.

MatthewVita commented 8 years ago

also, do you guys mind if I just merge everything in https://github.com/saxifrage/cityasacampus/milestones/Angularize%20Admin%20Dashboard%20Epic to https://github.com/saxifrage/cityasacampus/milestones/Admin%20Dashboard%20Epic

dmtroyer commented 8 years ago

Let's be very disciplined about making small user/technical stories in https://github.com/saxifrage/cityasacampus/milestones/Angularize%20Admin%20Dashboard%20Epic so we don't step on each other's feet.

Ok cool. I think what I will do is pare back the initial PR to login and stripping out the old dashboard. I think that will give us the best launching pad for parallel work.

also, do you guys mind if I just merge everything in

Go for it!

chelseaerdner commented 8 years ago

@dmtroyer working on saving those icons out now! Should have them over shortly.

dmtroyer commented 8 years ago

@chelseaerdner sent me the assets! Here's a link since github doesn't allow .svg or .zip:

https://drive.google.com/file/d/0Bwt4WeLO9DW9QmE5Q2VtWk5TU1U/view?usp=sharing

chadwhitacre commented 8 years ago

Actually, I just saw an SVG over at https://github.com/oh-my-fish/oh-my-fish/. O.O

Looks like a recent (re)addition on GitHub's part? https://github.com/oh-my-fish/oh-my-fish/pull/139 just happened yesterday.

chadwhitacre commented 8 years ago

Boo! :-(

screen shot 2015-11-30 at 7 36 45 pm

chadwhitacre commented 8 years ago

Here's my first test with http://recordit.co/ ...

ja7agffipa

chadwhitacre commented 8 years ago

Smaller ...

errzfmwkn7

dmtroyer commented 8 years ago

image

chadwhitacre commented 8 years ago

Woo-hoo!

!m @dmtroyer @chelseaerdner

chelseaerdner commented 8 years ago

Looking good! @dmtroyer (and everyone)