Course: Create a Block Theme (Low-Code) - Course #1 #631
Description
This issue updated by @wparasae on September 23rd 2022
Designing a Course from Start to Finish (Brainstorm Checklist Rough Draft Template)
- ANY CONTRIBUTOR: Submit a course proposal (form TBD)
- ANY CONTRIBUTOR: Course proposal will be reviewed; if approved, move onto the next step -- course proposer does not have to be the course designer. This intention should be made clear when someone submits a course idea (i.e. ask the question, "Do you want to be the course designer?) NEED: Define "Course Designer" and what all that entails
- COURSE DESIGNER: Complete a Course brainstorm (see questions below) -- there are no right or wrong answers here, this is just to get your ideas down on paper.
- COURSE DESIGNER: Meet with Course Faculty Buddy to "Chunk" your course into Modules & Lessons - Your buddy will help you write lesson objectives and chat with you about your awesome course idea!
- ANY CONTRIBUTOR: Find related resources on Learn.WordPress.org that already exist, link to each of them in this example -- this step can be done with your buddy or independently.
- ANY CONTRIBUTOR: Find lesson plans that already exist and link them to this course -- this step can be done with your buddy or independently.
- COURSE DESIGNER: Create new required lesson plans and link them to this this step -- can be done with your buddy or independently
- FACULTY BUDDY: Create course frame in Sensei (Need to figure out how Lesson Plans / Courses / Content will Merge)
- ANY CONTRIBUTOR: Write lesson plans (Google docs or in Sensei frame?) (Or in the lesson plan format, unclear where this is going at the moment...)
- ANY CONTRIBUTOR: As each lesson plan is created, submit it to the Training team to be reviewed.
- ANY CONTRIBUTOR: Review submitted lesson plan; COURSE DESIGNER should also review and modify lesson plans as they are submitted.
- ANY CONTRIBUTOR / COURSE DESIGNER: Identify workshops and create as needed or submit requests for workshops to be created with the training team
- FACULTY BUDDY: Check in with the COURSE DESIGNER.
- COURSE DESIGNER: Write course introduction (can be done at any point) - potentially want a frame for this to help standardize or make it easier to brainstorm.
- ANY CONTRIBUTOR: Content & Accessibility Review
- ANY CONTRIBUTOR: Copy Editing + Reach out to Marketing about Promotions
- COURSE DESIGNER + FACULTY BUDDY: Publish
- ANY CONTRIBUTOR: Celebrate!
COURSE BRAINSTORM
Course Template: Create a Block Theme (Low Code) - Course #1
Course Designer: Sarah Snow (wparasae) - Message me in the #training channel (@arasae) if you have questions or would like to help!
Brainstorm Questions: You can either complete this brainstorm with the buddy or you can answer these questions (no wrong answers!) ahead of time.
1. What is the problem that this course is trying to solve? Describe it.
There is a gap between what an intermediate WordPress user / Figma course designer know about building themes from scratch. This course works to bridge that gap; for users who want to be able to design a fully custom theme of their own, they will learn the fundamentals of theme creation. Designers will be empowered to create themes of their own in the site editor. It will also help prepare learners develop vocabulary to talk about this process and familiarize themselves with new developers. The goal is to bridge the gap between intermediate WordPress user and beginning WordPress developer.
2. Course OBJECTIVE: What is a PROJECT someone should be able to complete if they take this course?
"By the end of this course, a learner should be able to... (list 1 or 2 project ideas)
Intermediate users and theme Figma designers will be able to...
-Build a fully functional, custom WordPress theme with very little coding (theme.json) required.
3. Who is the audience for this course? How will this course address this need?
Designers / Intermediate Users who want to become theme designers - designers who use Figma -- course #1 empowers them to design their own custom WordPress theme using WordPress' full site editor. It also should illustrate different kinds of best practices in building a block theme.
4. Describe the Audience: What should this audience already know and be able to do comfortably? Bonus: What MIGHT this audience already know?
This audience (intermediate users and Figma designers) already knows how to...
-Navigate the WordPress dashboard comfortably
-How to install and update themes
-How to identify a classic theme vs. a block theme
-Use the site editor (including list view, using blocks, using patterns, etc.)
This audience MIGHT already know...
-The general process of classic theme development
-How to use Figma to design certain themes
5. Look at your overall course objective. Brainstorm (no right or wrong answers here): As you consider the project you're hoping people will be able to do, ask yourself:
- What are the things your audience doesn't know about this topic yet?
- Or, conversely, what are some questions they might ask about your topic?**
-The process of block theme creation from start to finish
-Detailed differences between block, classic, hybrid, and universal themes
-The anatomy of a block theme (what each file is and how they work together)
-How to use a text editor to navigate to a theme's files
-How to create new files using a text editor
-What a theme.json does, how it works, and how to use schema to help new users design
-The different templates that make up
-Template hierarchy: how it works in-context. When you forget a 404 page, what happens?
-Users may not know of design best practices, so we may want to include them on each template or template part.
Questions an intermediate user might have:
-What's a splash page, and what are best practices about designing them?
-What are the different template parts? What are required? Why? What happens if I don't have these templates?
-What are the best practices for designing a header or footer? (Maybe link out to a workshop, SLS?)
-What are font and color best practices when it comes to theme design?
Questions a designer might have:
-Why should I use the site editor instead of Figma?
-What are the current limitations of the site editor? What are the possibilities? Where can I learn more about code?
Questions both will have:
-How does theme.json work, and how does it help me?
-What are "semantic colors" and why should I use them?
-How do I pick and use fonts in my theme?
-What are the benefits of lock blocking? How does someone lock a block so that a user who uses this custom theme can't delete essential part?
6. What resources already exist? Check learn.wordpress.org for tutorials, lesson plans, courses, and former social learning spaces that already exist. Link to them below. (This can be done with your buddy or at a later point).
**Other Considerations: (Optional)
- What vocabulary will this audience need to learn? Write a list of terms and definitions as a brainstorm.
- What information do you have? Conversely, what information do you NOT have yet that you need in order to complete this course? We can work to pair you with a subject matter expert or reach out for other contributor help if needed.
**
Next steps: Work with your buddy to create a course outline using this brainstorm. Your instructional design buddy will walk you through "chunking" the content into modules and individual lessons, and help you come up with learning objectives for each module and/or lesson. From there, you can create lesson plan templates to link to the course.
COURSE OUTLINE - Find/Create + Link Lesson Plans
Modules:
1. Building Background Knowledge: The Theme Creation Process
- Developing Different Types of Themes: Overview - Now Available on Learn
- How Classic and Block Themes Are Developed Now Available on Learn
- What a Theme Designer Needs to Know: Anatomy of a Block Theme Now Available on Learn
2. Setting Up Your Development Environment and Essential Files
- Setting Up Your Block Theme's Development Environment Now Available on Learn
- Creating Your Block Theme's style.css Now Available on Learn
- Creating Your Block theme’s index.php Now Available on Learn
- Your Block Theme’s theme.json Now Available on Learn
3. Using the Site Editor to Build Your Custom Theme
- The Basics of theme.json for New Developers - Now Available on Learn
- Your First Codes in theme.json: Appearance Tools (Activity from 1st lesson in this module )
- [A Website's Look & Feel: Design Best Practices] ([Related Course: Create a Custom Block Theme #1] A Website's Look and Feel: Design Element Best Practices and Brainstorm COURSE Lesson Plan #838)
- Your First Template: Create A Style Guide Using the Site Editor Now Available on Learn
- Block Theme Design Challenge: Templates In The Site Editor] ([Related Course: Create a Custom Block Theme #1] Block Theme Design Challenge: Templates In The Site Editor (Course Lesson Plan) #841) Now Available on Learn
4. Advanced Custom Theming: Low-Code Challenge
- Saving Your Work with Create Block theme Now Available on Learn
- Selecting Your Theme's Default Fonts Now Available on Learn
- Your First Template: Create a Style Guide Using the Site Editor Now Available on Learn
- (Exercise) Using Patterns to Design Your Header & Footer Template Parts Now Available on Learn
- Block Theme Design Challenge: Templates in the Site Editor Now Available on Learn
5. Theme Enhancements: Advanced Options to Make Your Theme Stand Out
Changes: This module will be heavily revised; each of these is pretty heavily based in code, and a different module for each is probably more than a beginning theme developer might need to know.