Blog Post

E-Learning Challenges
2 MIN READ

Using Neubrutalism Designs in E-Learning #483

DavidAnderson's avatar
DavidAnderson
Staff
2 months ago

Using Neubrutalist Design Elements in E-Learning #483: Challenge | Recap

🏆 Challenge of the Week

This week, your challenge is to share a six-slide course starter template using neubrutalist design. Check out our related brutalism design challenge for an idea of what to build.

What is Neubrutalism?

Neubrutalism takes raw brutalism and pairs it with bold colors, thick shadows, and quirky-yet-readable typography. 

And here’s the kicker: it leans into being ugly on purpose. You’ll see stuff like buttons that are slightly off-center or elements that look misaligned. It feels approachable, like something you could whip up yourself, which is why it works.

Common design elements include:

  • Bold Contrasts: High-contrast, desaturated colors with intentional clashes.
  • Quirky Typography: Thick, readable fonts balanced with whitespace.
  • Raw Aesthetic: Hard shadows, bold borders, and purposeful misalignments.
  • Playful Graphics: Vibrant colors and simple, low-fi illustrations.
  • Dynamic Touches: Parallax scrolling and subtle animations.

Resources & Examples

✨ Share Your E-Learning Work

  • Comments: Use the comments section below to link your published example and blog post.
  • Forums: Start a new thread and share a link to your published example.
  • Personal blog: If you have a blog, please consider writing about your challenges. We'll link to your posts, so your great work gets even more exposure.
  • Social media: If you share your demos on Twitter or LinkedIn, try using #ELHChallenge so your tweeps can follow your e-learning coolness.

🙌 Last Week’s Challenge:

Before you share your intentionally quirky designs, check out the creative ways course designers use asymmetrical layouts in e-learning:

Asymmetrical Design in E-Learning RECAP #482: Challenge | Recap

đź‘‹ New to the E-Learning Challenges?

The weekly e-learning challenges are ongoing opportunities to learn, share, and build your e-learning portfolios. You can jump into any or all of the previous challenges anytime you want. I’ll update the recap posts to include your demos.

Learn more about the challenges in this Q&A post and why and how to participate in this helpful article.

Updated 2 months ago
Version 3.0
  • JodiSansone's avatar
    JodiSansone
    Community Member
    2 months ago

    Raw Works Studio

    Demo

    https://jodisdemos.s3.us-east-1.amazonaws.com/483+Raw+Works/story.html

    Download

    https://jodisdemos.s3.us-east-1.amazonaws.com/483+Meet+Raw+Works+Neubrutal.story

    Puke-a-palooza.

    Ugly on purpose. Expensive by accident. 

    I started working on this late Saturday afternoon. I was so focused on trying to interpret and meet the challenge objective that I forgot I had turned on my garden hose in the yard. I left it running all night long, so I'm expecting a monster water bill for November. 

    My 6 slides are an intro, menu, labeled graphic, profile, quiz, closing.

    • JodiSansone's avatar
      JodiSansone
      Community Member
      2 months ago

      You gave us so much to digest! Creatively, I like the grungy reinterpretation of the Louvre intro page-- the colors, layout and the font types. La Joconde and Nirvana seemed to work well together. Who could have guessed? Thank you for identifying your resources in the notes panel. Technically, I was intrigued by your quiz "slider".  The graphic neubrutalism style is tolerable to me, but I still don't like this architecture. You see it in our US cities (e.g., New York, Brooklyn, Chicago, San Diego) for our metropolitan correctional facilities. :)

      • ThierryEMMANUEL's avatar
        ThierryEMMANUEL
        Community Member
        2 months ago

        Hi JodiSansone . Indeed, you seem to have used as few graphic resources as possible to get the best result, whereas I used dozens per slide. (I can't access your file to check because I'm blocked by an “AI function” I don't have yet (so it's not a question of whether I really want/need AI functions but... we don't really have a choice. But that's another question) I've attached a simplified file of the quiz slider slide in the Review. Finally, who likes Brutalist architecture? Concrete and stacking have become unpopular for aesthetic, environmental or functional reasons. But it leaves no one without a reaction, good or bad. It's better than the absence of emotion. I chose the Sirius Building because of the facade (which I photoshopped a bit) in the photo.

    • PhilipCranst866's avatar
      PhilipCranst866
      Community Member
      2 months ago

      Nice surprise. I genuinely thought you'd missed the brief to start with!

  • PhilipCranst866's avatar
    PhilipCranst866
    Community Member
    2 months ago

    Wanted to do another challenge for the first time in a while, then thought I'd take a pass on this week as I didn't think I was a fan of Neubrutalism. But found this challenge quite liberating. I'm a high school teacher, and I think the style is well received by students. "Content is King", and I feel neubrutalism is pragmatic in the sense that you don't need to go back and refine, adjust or perfect. In some ways it's just about 'getting it on paper'. Perfect for busy teachers!

    Also, I'm becoming interested in analogue work and basic sketching, I think this may become increasingly valued in our new AI world. The sketches in this were just my rough plan, then I thought "Hang on, with neubrutalism, near enough is good enough. As long as it gets the message across"

    https://360.articulate.com/review/content/4c166aa0-5ba8-410f-b785-268cb13ef9bd/review

  • Jonathan_Hill's avatar
    Jonathan_Hill
    Super Hero
    2 months ago

    Hello!

    Here's a demo based on the neubrutalist design influences found in one of my favourite comic book series, Scott Pilgrim vs the World.

    IT'S NOT GRIM - DEALING WITH SMEs
    https://bit.ly/elhc483 

  • DanGraham1's avatar
    DanGraham1
    Community Member
    2 months ago

    Great challenge David! On the cutting edge of design trends as always. :)

    I put together something quick and dirty today, and I fell in love with the idea of 8-bit graphics with this style. It just seemed natural. I'm curious how learners would respond to this sort of look and feel. I have a hunch that there would be equal parts people that love it and find it refreshing, and then the fuddy duddy's who will hate it. 

    Anyway, here's what I put together... 

    And a link to a blog article with some thoughts.

    • BeckSullivan's avatar
      BeckSullivan
      Community Member
      2 months ago

      Dan, while I think I'm usually a fuddy duddy, I enjoyed all aspects of your answer to the challenge! 

      • DanGraham1's avatar
        DanGraham1
        Community Member
        2 months ago

        Hey Beck!! Long time! 

        I don't think you're in Fuddy Duddy territory yet. :) 

        I appreciate it the kind words. This was a fun challenge! 

    • ThierryEMMANUEL's avatar
      ThierryEMMANUEL
      Community Member
      2 months ago

      As you're wondering DanGraham1 , (very-very personal opinion) I'm in the middle: I love the look until I'm overwhelmed. On the other hand, you haven't done anything dirty at all and the 8-bit visduals are a great idea. What's more, you've done a whole, interesting training course.

  • JodiSansone's avatar
    JodiSansone
    Community Member
    2 months ago

    I forgot to mention this was the first time I used the AI Quiz generator. I didn't have great quiz content, but I felt it worked pretty well given the source material. 

  • hotneon's avatar
    hotneon
    Community Member
    20 hours ago

    This was a fun one to play around with! Imagine a mobile sales enablement tool for a crystal company.