Bixal / methods

A guide to help practice and promote human-centered design and agile delivery to improve outcomes.
https://bixal.github.io/methods/
Other
1 stars 3 forks source link

Create master list of templates and link to Methods #85

Closed pglevy closed 3 years ago

pglevy commented 3 years ago

We have a template inventory of existing resources on the site and a list of Miro templates that relate to the Methods. To make them more accessible, consolidate them in one place and also link them to the related Methods. As part of this, we can determinations about which ones to use or not, but erring on the side of including what we have for now and starting Discussions on items we want to revisit.

Prioritize getting the collected list of templates up on the site. Then, follow up with feedback/assessment on what we have, getting as much done as we can within the cycle.

Some POC reference images: Using a data file to list all templates on a page

Using front matter to add template links to a method

pglevy commented 3 years ago

Hey @Bixal/methods, I've been checking out the templates as I've been adding things. Still more to do, but I figured I'd go ahead and publish what we have so far so you can check it out in context and provide feedback. So you can see the updated Templates page on the live site now. And the templates are linked in each Method as well, such as Personas. Let me know if you have thoughts or feedback.

sofya-UX commented 3 years ago

Thanks @pglevy, looks really nice, it's probably a very tedious copy pasting exercise :)

Capturing a couple minor cosmetic tweaks that we can do later on (so that I don't forget):

katharine-carr commented 3 years ago

@pglevy What do you think about having these templates open in a new tab rather than the same tab? Im thinking I'm likely to click around on a few on the list before deciding. Would be nice to have the template list stay put - otherwise im likely to hit 'back' a bunch of times. Thoughts?

pglevy commented 3 years ago
  • Interview checklist would benefit from those check boxes being more visible.

For the lists, there's not reliable control over the styling of those because it's mostly controlled by the browser. In this case, they're being rendered as disabled checkboxes. (That's why they're so light.) It's kind of a weird choice since the page itself is not intended to be an interactive form. But if you were to copy and paste into a Word doc, for example, it's not going to carry over those checkboxes anyway. What about just swapping them for regular bullets, like this?

image

pglevy commented 3 years ago
  • I wonder if the label "Templates" in the top navigation should be different in styling when the Template page is open. Currently, "Make a suggestion" button is so permanent that it threw me off at first, I wasn't sure if I was in the right place.

We're not doing any "current location" highlighting right now, though it's less of an issue with the main nav because of the coloring and prominent titles. We could use the hover/active underline for that there, but I'm not sure about Templates because that's kind of functioning as a "utility nav" in that section, and it exists outside the main navigation structure. And I don't think utility navs typically do current location highlighting. Doesn't mean we can't though. What do you think @katharine-carr?

Also, not quite sure what you meant by ""Make a suggestion" button is so permanent that it threw me off at first, I wasn't sure if I was in the right place."

pglevy commented 3 years ago

@pglevy What do you think about having these templates open in a new tab rather than the same tab? Im thinking I'm likely to click around on a few on the list before deciding. Would be nice to have the template list stay put - otherwise im likely to hit 'back' a bunch of times. Thoughts?

I think that makes sense because most of them are external... but some are internal. Do you think it would be weird or cause confusion to open a Methods page in a new tab? (Like the Interview Checklist, for example.) Then it would look like you're still on the same site, but the back button wouldn't work. I could try to figure out some logic to do both if we think that would help.

sofya-UX commented 3 years ago

@pglevy the list setting makes sense, I do like this better, especially given that these boxes aren't interactive anyway.

As far as my 2nd comment, all I meant was that the "Make a suggestion" button is what my eye sees first, and not that I am on the Templates page, and that made me think of what could be done about it (i.e. maybe highlighting the templates in the menu as an indication that we are on the Templates page)...

Screen Shot 2021-01-29 at 12 22 21 PM
sofya-UX commented 3 years ago

Also, if it's not too late, maybe we could include this template for the Dot Voting method? I somehow missed it when I was gathering the list, @pglevy

https://miro.com/templates/dot-voting/

pglevy commented 3 years ago

@pglevy the list setting makes sense, I do like this better, especially given that these boxes aren't interactive anyway.

As far as my 2nd comment, all I meant was that the "Make a suggestion" button is what my eye sees first, and not that I am on the Templates page, and that made me think of what could be done about it (i.e. maybe highlighting the templates in the menu as an indication that we are on the Templates page)...

Screen Shot 2021-01-29 at 12 22 21 PM

Gotcha. Maybe the solution is to de-emphasize the suggestion button and make it consistent with the rest of the utility nav. I'll play around with it.

pglevy commented 3 years ago

Also, if it's not too late, maybe we could include this template for the Dot Voting method? I somehow missed it when I was gathering the list, @pglevy

https://miro.com/templates/dot-voting/

5 weeks left in cycle. There's still time! 😄

pglevy commented 3 years ago

Also, if it's not too late, maybe we could include this template for the Dot Voting method? I somehow missed it when I was gathering the list, @pglevy https://miro.com/templates/dot-voting/

5 weeks left in cycle. There's still time! 😄

After checking it out though, it's just a grid of dots, so not sure how much value that adds. 😉

katharine-carr commented 3 years ago

Re: the 'make a suggestion' button getting too much attention - I agree and had a similar experience. It might just be because the rest of the page is kind of stark; the orange is the only zippy thing. Body area needs something to even it out.

Re: opening links in new window vs same window - my gut says it wont be weird for the internal links to open in a new window as long as its the interaction throughout the rest of the page. My gut also says "lets test it!" 😄

pglevy commented 3 years ago

Re: the 'make a suggestion' button getting too much attention - I agree and had a similar experience. It might just be because the rest of the page is kind of stark; the orange is the only zippy thing. Body area needs something to even it out.

Re: opening links in new window vs same window - my gut says it wont be weird for the internal links to open in a new window as long as its the interaction throughout the rest of the page. My gut also says "lets test it!" 😄

If by "test it" you mean "ship it and see how it goes and change it if necessary," I'm down with that! Either way, it's a quick change, so I'll include it in the next "push" and you can try it out.

pglevy commented 3 years ago

@Bixal/methods, playing around with some highlighting for utility nav and light visual tweak. Open to other ideas as well.

image

pglevy commented 3 years ago

I've moved the styling question to separate discussion so we wrap up this issue. I was looking into a Content Audit template, but that seems a larger question, so I broke that out to a discussion as well.

So this is ready for review, @Bixal/methods. All this stuff is already on the live site, so you can view it there to see if there any additional feedback before closing out for this cycle.

pglevy commented 3 years ago

Since the list of template has become fairly long, what do you think about a TOC at the top of the page? This lets you know which methods have templates before you start scrolling, and lets you jump right to them.

image

katharine-carr commented 3 years ago

This looks nice @pglevy !

I know this isnt what you asked about, but what do you think about altering the intro text a little? Maybe:

"This is an index of all the templates referenced throughout this site, organized by method. These templates provide a starting point for your projects using our common tools."

I'm tripping over "our common tools" - im not sure what exactly it refers to. The templates, methods?

Feel free to ignore if this feedback is overly fussy.

pglevy commented 3 years ago

No, that's helpful. What I was trying to get at was templates for the tools we use, like Miro, Flowmapp, etc.

pglevy commented 3 years ago

Updated the copy to pretty much what you had, @katharine-carr. This is up on the site now. Moving this one to done since it's meets the initial criteria. We can look at adding some other enhancements to the page if there is time left in the cycle.