InstUI Style Guide for Instructional Designers


Hi everybody --

I'd like to propose an InstUI style guide for instructional designers. For years, I have used the design patterns and CSS classes in the old (now deprecated) Canvas style guide to create pages that look like they belong in Canvas. I would like to do the same with InstUI. But it looks like it is only available for LTI designers using React. Instructure is not supporting the old styles, but it is also not giving us the resources to design using the new styles, which puts me -- and I'm sure a lot of other folks -- in a bad position.

At the very least, it would be helpful to have a list of classes and what they do, and a few examples of how to use InstUI to create common page components like columns, (faux-)buttons, tabs, and accordion boxes.

Any help?

Community Participant

I have to admit, I'm disappointed to find that this is over a year old and hasn't received any sort of response from the Canvas team. There are a whole lot of us out there relying on the old unsupported style guides, and there's not much guidance up here on how we can support course development that leverages InstUI. I found my way here because I was looking for guidance on a more sustainable approach to tabs so that I don't just wake up one morning to find dozens of emails from angry faculty whose tabs have stopped working.

Community Explorer

@mwolfenstein I'm in the same boat. I would love some guidance on using InstUI tabs that doesn't involve hiring a React developer. Commenting for visibility. Edited to ask, did you find a solution, @mwolfenstein or @adam_zolkover? Thanks! 

Community Participant

@aspenwal I still haven't seen anything. We've started experimenting with our own custom CSS classes that aesthetically fit into Canvas, but are not the official way of doing things. I don't love this solution. But it's working for us for now.

Community Team
Community Team
Status changed to: Archived

Thank you for sharing this idea with the Instructure Community!

The Product Team reviewed all feature proposals recently, and unfortunately, this thread was identified as one that they would not be able to include in their current or future plans. While we appreciate your proposal, we also want to be transparent about the likelihood of something like this making it to production.

Thank you for collaborating, and we hope that you submit another idea in the future!