An explainer isn’t based on a question with a simple answer like “why does a cat purr?” but rather one that requires breaking down some complex details with a variety of sources and evidence. They’re a common tool for online media – Vox has its own section for them – and when planning your own, it helps to look at what’s come before. Let’s go back to that Cardi B and Nicki Minaj post (oh the sacrifices I make for education) and look at its components:

Hed: What’s being explained?

The Complete History of Nicki Minaj and Cardi B’s Beef

Okay, it’s a bit of a label hed, but you definitely know what you’re getting. Any good explainer post is built around the question “Why/How did things come to this point?” Your hed should reflect this, ideally by incorporating those “Why” and “How” words.

Lede: Why explain it now?

For more than a year, Nicki Minajand Cardi B walked on eggshells while rumors of their alleged beef bubbled just below surface. Through shady interviews and sneak disses, the rappers waged a cold war. Then, during New York Fashion Week at Harper’s Bazaar Icon party, photos and video of a physical altercation between Cardi and Nicki’s parties circulated the web.

Since then, their public feud has intensified, with memorable Queen Radio rants and viral Instagram posts. But how exactly did we get here? Was it Nicki’s obsession with being the queen of rap? Is Cardi too sensitive? Below we revisit the history of Cardi B and Nicki’s long simmering feud and the events that led us here.

Explainers should be timely and clearly answer the “Why NOW” question. The beef in question dates back to June 2017, but the New York Fashion Week fight is what made it newsworthy for its Oct. 30, 2018 publication date.

Structure

This particular post takes the form of a timeline chronicling the various slights cast by B and Minaj. It’s marked by entries such as:

August 2017: Nicki denies subbing Cardi on “No Flags”

Notice how the post is broken up with subheadings that start with the date and detail what happened then. Even if you’re not doing a timeline, this bite-sized format helps make the complexity more approachable.

Support

This post in particular is strong because it not only employs strong evidence for its explanation, it brings in a strong VARIETY of sources. Consider this passage:

Coincidentally, Nicki’s original verse on “MotorSport” leaked the same day as her interview, revealing she had referenced Cardi:

I’m with a couple bad bitches that’ll rip the party
If Cardi the QB, I’m Nick Lombardi
Pull up in the space coupe, I done linked with Marty
I can actually afford to get a pink Bugatti

The final version replaced Cardi’s name with Quavo, and it’s still unclear if it was meant to be shade or a shout out. Nicki later tweeted that she changed the verse per Atlantic’s request.

How can you say someone changed their verse & forget to say Quavo TOLD me to remove my singing part (which I loved) & Atlantic told me to remove your name from my verse per your request? So how were those changes gonna happen if I didn’t “change” my verse? 😩🤣 #NickiDay#ChunLi

Here you’ve got a link to an article that leaked Minaj’s lyrics, followed by those lyrics themselves (which name Cardi B), then the detail that the final song changed “Cardi” to “Quavo,” and finally a tweet from Minaj claiming that Cardi B forced the change. That’s pretty detailed documentation!

It’s typical of the article, too: throughout, it employs links, social media posts, screenshots and video to support every claim it makes. This isn’t just gossip, it’s a fully documented account.

Planning your explainer

Here’s a few steps, via Poynter, for creating an explainer post of your own:

Figure out what to explain: What’s a subject your readers need/want to have broken down for them? Look for a question that “requires more than a fact to explain.”

Report the explainer: Poynter recommends contacting multiple experts; for a blog post, that translates into multiple explanatory links and media. Keep your questions pretty basic – think elementary school level – and along the lines of “why does this happen?”

Craft the explainer: Don’t start with history, start with why it matters now. This is similar to establishing a news peg for any story. Poynter provides a tremendous example here: After President Obama signed a bill restoring Secret Service protection to former presidents and their families, Slate asked the question “does that include presidential pets?” (you’ll have to click through for the answer)

Consider voice and style: (This one’s from The Word Factory) An explainer typically deals with a complicated subject, so it’s particularly important to avoid technical jargon or lengthy, complex sentences. Often, a more casual or conversational tone will be used to lighten a heavy subject (that’s up to the individual publication though).

Remember: You’ll have an assignment on this as well, so start thinking now about what your readers need explained!

We set up our WordPress blogs in class, but it’s helpful to have a guide available for troubleshooting, so here you go! Follow the handy steps below to get started – feel free to stick with me or dash ahead.

The format is YOURNAME.wordpress.com (unless you’ve got a killer name in mind, using your real name is just fine)

May take a couple tries to find one not taken

Once you’ve got a blog …

Post!

Log in & in the top infobar click “New Post”

Important!To access the main menu, enter your blog’s URL and add “/wp-admin” after it (example: interactivejournalismwvu.wordpress.com/wp-admin). There should be a BLACK bar at the top, not a blue one.

Enter a title in the top box, enter your text in the lower box (we’ll delete it later)

For more detail, go to your dashboard (link in top left of infobar > WP Admin) – in left menu, Posts > Add New

It’s preferable to compose your posts in a word processing program then paste them into the blog box

Add value! (in dashboard view only)

Images: Make sure you know where the image is, then click Add Media > Upload Files > Select Files. Find your image, and decide where you want it in the text (left, right, or center). Make sure you have permission to use the images you do, and include a source credit!

Links: Select the text you want to make into a link. Click the little chain link icon above the text window and enter an address (or cut and paste) – it MUST begin with http:// (your links should look like this)

Tags and Categories: Tags and categories (in the right menu) help index your posts. Just type a new one and click “add”.

Publish!

Click the big blue “Publish” button in the right menu

If you want to save a post for later, click “Save Draft”

Log in later and publish manually

Set a specific time for it to publish automatically

This is a great tool for writing posts on your own time to post during our 10a – 4p Monday-Thursday requirement

Don’t like what you have? Open the post in its own window (click the headline), scroll to the bottom, click “edit” and make the changes you want.

NOTE: Whenever you make an assigned blog post, be sure to check the assignment for where to post the link (typically as a comment to the assignment post but sometimes as an email or tweet)

And remember…

Your first post should not be published until Thursday, Aug. 28 (between 10a and 4p). Regular blogging hours are from 10a-4p, Monday through Thursday. Posts (one required every week) must be made within this time to receive credit! That doesn’t mean you have to write them then – write when you want and save it as a draft to post later – but they MUST be posted then.

Any special requirements for your week’s personal blog will be included in the previous week’s Thursday post, but in general posts need a minimum of three meaningful links and three relevant media content (pics, video, social posts) embeds. Headlines should be specific and relevant; first-paragraph leads should be about 25 words.

Last time you learned the basics of making a rule-based chatbot that can respond to some basic triggers (hi, yes, no, maybe, what is the meaning of life). Nifty but not too journalistic, so now we’re going to progress toward making a simple on-the-rails explainer (remember those?) using buttons.

For a great example of this, remember the Quartz News (nee Quartzy) chatbot from class. The bot may seem complex, but if you walk through one of its stories, you actually have very few options – many checkpoints only provide a single option, and the ones that provide more quickly return to the main story. This simple engagement, coupled with a distinctive voice and an interesting story, provides a way to relate the news via your bot, and it’s pretty much all done with buttons. Let’s make one!

Your first button

Select your bot from last time and go into Edit mode (the pencil icon). We’ll keep our hi/Hello There! first interaction, but we’ll have our bot follow it up with a button to direct the reader’s next step.

Your first two lines of code should say:

+ hi

– Hello there!

Hit return twice and add the following:

+ intro button

–

Add a space after the – and leave your cursor there. Next, do the following:

Click the button icon at the top of the edit panel (second from the left).

This adds the button code, which will look like this: ^buttons(First Choice, Second Choice, Third Choice)

The text is all placeholders. The only things you can’t change are the punctuation marks ^ and ()

Delete everything in the parentheses and replace it with “What are you?“

Back at the top, after “Hello There!” add a space and the code {@ intro button} so the button will show up after the robot is triggered with “hi”

Right now you’ve created a button that doesn’t go anywhere – give it a try! Next, we’ll make it do something by adding the following code:

+ what are you

– I’m a bot!

Publish and try it out! Your code should now read:

+ hi– Hello there! {@ intro button}

+ intro button– ^buttons(what are you)

+ what are you– I’m a bot!

Did it work? If not, go through our troubleshooting list (is it published? are there capitals or punctuation in triggers? did you add the {@ intro button} code in your bot’s first response?). If not, check in with me and we’ll see.

Adding more buttons

This is the simplest button scheme you can have – there’s only one choice! What I’d like you to do now is add in a second option for the reader who already knows what a bot is. Back in the response to + intro button, add a comma after what are you and add a second option, who made you It will look like this now:

+ intro button– ^buttons(what are you, who made you)

Then, at the bottom of your code, add this new trigger/response pair:

+ who made you

– You did, silly!

Publish and try it out! If it fails, run through the usual steps, which you should be getting pretty good at.

Tell me a story

Now you know how to write button code with ^buttons() and how to call that code with { }. From here, we’re going to turn this to something more practical. Identify a simple story related to your interests that can be told in three stages (plus an introduction). Think again of the Quartz News example – we’d call this an explainer – and don’t overthink it!

Keep it short and conversational!

Each stage should progress via a single button

Try at least one stage with two buttons

When you’re done, go to the deploy menu, click the switch that deploys your bot (it won’t work otherwise, as we learned last time), paste the code at pste.edu and give it a try. If it works, go to this link (it’s a Google Doc) and add your chatbot (with your name and description) to the list. Let’s see what you come up with!

We’ll be designing basic chatbots in the next few weeks. You learned about these in this week’s readings, so you know you’ve already interacted with a chatbot on your phone, in your home, and probably lots of other places. The bots we’re going to make will be simple, rule-based call-and-response setups, but they’ll be enough to put together a simple explainer for your personal or group blog. Let’s get started!

FIRST: Create an account on rundexter.com (Dexter is a free platform for building chatbots) and log in

First contact

Select a Blank theme and create a new bot (there are lots of possible themes to browse, but we’re starting simple).

Rename your bot (top left) and in the big window, delete all the default code – we’re starting from scratch!

On the first line, enter “+ hi” (don’t use quotation marks, and don’t forget the space)

Hit return, and on line 2 enter “– Hello There!” (again, no quotes and remember the space)

On the right, click the big friendly green button that says “Publish Current Topic”

There’s a phone-shaped window on the right with an entry blank at the bottom. Type in “Hi” – your chatbot should respond “Hello There!“

What did you just do? You created a trigger (the + part) and told the chatbot how to react (the – part) when it encountered that trigger. It’s a call-and-response, like how when you say “Let’s Go!” people respond “Mountaineers!” This is a rule-based chatbot: It doesn’t really use artificial intelligence to “think,” it just reacts to preprogrammed stimuli.

Now try the following:

Tell your chatbot both “hi” and “Hi” and “hi!” – what happens?

Tell your chatbot “hello” – what happens? Why?

Does my chatbot hate me?

If “hi” didn’t get you a response, there’s two likely reasons. The code for your chatbot triggers (the code after +) cannot contain either of the following:

Capital letters (“+ Hi“)

Punctuation (“+ hi!“)

Make sure you include a space after the + or – in your code

Look at your code. Does the trigger contain either of those? If so, there’s your problem. Also note that the chatbot responses CAN contain caps and punctuation. Also ALSO note that you can include these when talking to your chatbot, so either “hi” or “Hi” or “”HI!!!!!!!” will work just fine. “Hello” or “Hi there” won’t, however, because right now your chatbot is only coded to respond to versions of “hi”.

Sorry, didn’t get that

As you’ve just seen, chances are users are going to say things to your bot that it’s not prepared for. It’s good practice to have a catch-all response for this.

Below that, add an error response such as “– Sorry, I don’t understand that command.“

You’ll have to republish the bot (green button) before you can test out the new code

That asterisk (*) trigger is a wildcard, meaning it stands in for any trigger not specified in your code. Right now, that means anything other than a variation on “hi” will return the catch-all message.

There are other uses for the wildcard operator too:

Add it in brackets before or after a trigger to allow additional words – so “+ hi [*]” would recognize both “hi” and “hi there”

Bots commonly also recognize requests for help by including the trigger “+ [*] help [*]” (along with a response that gives the user a list of help commands)

Publishing your bot

We’ve tested our bot in Dexter, but it’s not the best way for seeing your work in action. To try it out, we’re going to copy the code to an HTML pastebin that will show what it’d look like in Messenger or on your phone.

Click the green Publish Topic button when your bot is ready

At the top of the screen, click “Deploy” (the paper airplane icon)

You’ll get a window that says “Embed Code” with a block of code under it. Select that code and copy it.

Go to the link you get and click the chat bubble in the bottom right to activate your bot!

NOTE: In previous classes, we’ve found this often doesn’t work on the first try. If you don’t get the bubble icon (bottom right), try repasting the code and reloading, or republishing the code in rundexter and pasting that. It always works eventually, it’s just weird sometimes.

That’s it! You now have a functioning – if somewhat dull – bot. Next, try building in some additional triggers and responses. What should this bot do? How can you use it to tell a simple story? We’ll do more with this in our next session.

Notice how with each of those questions, there’s a complex set of reasons and perspectives informing the answer. An explainer isn’t based on a question with a simple answer like “why does a cat purr?” but rather one that requires breaking down some complex details with a variety of sources and evidence.

Explainers are a common tool for online media – Vox has its own section for them – and when planning your own, it helps to look at what’s come before. Let’s go back to that Cardi B and Nicki Minaj post (oh the sacrifices I make for education) and look at its components:

Hed

The Complete History of Nicki Minaj and Cardi B’s Beef

Okay, it’s a bit of a label, but you definitely know what you’re getting. Good explainer heds typically start with words that imply a question such as “How” or “Why” or “Does”.

Lede

For more than a year, Nicki Minajand Cardi B walked on eggshells while rumors of their alleged beef bubbled just below surface. Through shady interviews and sneak disses, the rappers waged a cold war. Then, during New York Fashion Week at Harper’s Bazaar Icon party, photos and video of a physical altercation between Cardi and Nicki’s parties circulated the web.

Since then, their public feud has intensified, with memorable Queen Radio rants and viral Instagram posts. But how exactly did we get here? Was it Nicki’s obsession with being the queen of rap? Is Cardi too sensitive? Below we revisit the history of Cardi B and Nicki’s long simmering feud and the events that led us here.

This answers the “Why NOW” question. It’s an ongoing story that dates back to June 2017, but the New York Fashion Week fight is what made it newsworthy for its Oct. 30, 2018 publication date.

Structure

This particular post takes the form of a timeline chronicling the various slights cast by B and Minaj. It’s marked by entries such as:

August 2017: Nicki denies subbing Cardi on “No Flags”

Notice how the post is broken up with subheadings that start with the date and detail what happened then. Even if you’re not doing a timeline, this bite-sized format helps make the complexity more approachable.

Support

This post in particular is so strong because it not only employs strong evidence for its explanation, it brings in a strong VARIETY of sources. Consider this passage:

Coincidentally, Nicki’s original verse on “MotorSport” leaked the same day as her interview, revealing she had referenced Cardi:

I’m with a couple bad bitches that’ll rip the party
If Cardi the QB, I’m Nick Lombardi
Pull up in the space coupe, I done linked with Marty
I can actually afford to get a pink Bugatti

The final version replaced Cardi’s name with Quavo, and it’s still unclear if it was meant to be shade or a shout out. Nicki later tweeted that she changed the verse per Atlantic’s request.

How can you say someone changed their verse & forget to say Quavo TOLD me to remove my singing part (which I loved) & Atlantic told me to remove your name from my verse per your request? So how were those changes gonna happen if I didn’t “change” my verse? 😩🤣 #NickiDay#ChunLi

Here you’ve got a link to an article that leaked Minaj’s lyrics, followed by those lyrics themselves (which name Cardi B), then the detail that the final song changed “Cardi” to “Quavo,” and finally a tweet from Minaj claiming that Cardi B forced the change. That’s a pretty detailed documentation!

That’s typical of the article, too: throughout, it employs links, social media posts, screenshots and video to support every claim it makes. This isn’t just gossip, it’s a fully documented account.

Planning your explainer

Here’s a few steps, via Poynter, for creating an explainer post of your own:

Figure out what to explain: What’s a subject your readers need/want to have broken down for them? Look for a question that “requires more than a fact to explain.”

Report the explainer: Poynter recommends contacting multiple experts; for a blog post, that translates into multiple explanatory links and media. Keep your questions pretty basic – think elementary school level – and along the lines of “why does this happen?”

Craft the explainer: Don’t start with history, start with why it matters now. This is similar to establishing a news peg for any story. Poynter provides a tremendous example here: After President Obama signed a bill restoring Secret Service protection to former presidents and their families, Slate asked the question “does that include presidential pets?” (you’ll have to click through for the answer)

Consider voice and style: (This one’s from The Word Factory) An explainer typically deals with a complicated subject, so it’s particularly important to avoid technical jargon or lengthy, complex sentences. Often, a more casual or conversational tone will be used to lighten a heavy subject (that’s up to the individual publication though).

Remember: You have an assignment on this as well, so start thinking now about what your readers need explained!

We set up our WordPress blogs in class, but it’s helpful to have a guide available for troubleshooting, so here you go! Follow the handy steps below to get started – feel free to stick with me or dash ahead.

The format is YOURNAME.wordpress.com (unless you’ve got a killer name in mind, using your real name is just fine)

May take a couple tries to find one not taken

Once you’ve got a blog …

Post!

Log in & in the top infobar click “New Post”

Important!To access the main menu, enter your blog’s URL and add “/wp-admin” after it (example: interactivejournalismwvu.wordpress.com/wp-admin). There will be a BLACK bar at the top, not a blue one.

Enter a title in the top box, enter your text in the lower box (we’ll delete it later)

For more detail, go to your dashboard (link in top left of infobar > WP Admin) – in left menu, Posts > Add New

You may want to compose your posts in a word processing program then paste them into the blog box

Add value! (in dashboard view only)

Images: Make sure you know where the image is, then click Add Media > Upload Files > Select Files. Find your image, and decide where you want it in the text (left, right, or center)

Links: Select the text you want to make into a link. Click the little chain link icon above the text window and enter an address (or cut and paste) – it MUST begin with http:// (your links should look like this)

Tags and Categories: Tags and categories (in the right menu) help index your posts. Just type a new one and click “add”.

Publish!

Click the big blue “Publish” button in the right menu

If you want to save a post for later, click “Save Draft”

Log in later and publish manually

Set a specific time for it to publish automatically

Don’t like what you have? Open the post in its own window (click the headline), scroll to the bottom, click “edit” and make the changes you want.

NOTE: Whenever you make an assigned blog post, be sure to check the assignment for where to post the link (typically as a comment to the assignment post but sometimes as an email or tweet)

And remember…

You don’t need to post anything until next Thursday, Jan. 17 (we’ll workshop first posts in class). Regular blogging hours are from 10a-4p, Monday through Thursday. Posts (one required every week) must be made within this time to receive credit! That doesn’t mean you have to write them then – write when you want and save it as a draft to post later – but they MUST be posted then.