data, data journalism, data visualization, HTML, instagram, Interactivity, Javascript, maps, social media

[MUSIC MAP] My summer through Instagram pictures and Spotify songs

I have been experimenting with Instagram, again. This time, I have established a relationship between a picture of the day and a song recently discovered on Spotify through the Discover Weekly feature. The below post would be an example:

Picture + Name/lyrics of the song  + 🎶  + hashtags

 

After gathering the data, I mapped these posts using the Mapbox JS library and I made each song playable on the same window. This is the result:

output_5AfmIU

Below I explain the process of collecting and mapping the data: 

Continue reading

Standard
automation, chatbots, data journalism, journalism, social media

How to: build a Telegram bot with Chatfuel

Telegram holds official bots and displays easy settings that help users without developing skills to build basic chatbots. On this previous post, I explained how I created three different bots through commands, menus, and submenus.

However, there are other tools that speed up the development of chatbots. For instance, Chatfuel. This platform runs the bot through an API Key, and administrators can create buttons and menus for a quick navigation.

I tested this platform creating a bot for the Noda and Tutki16 conference in Helsinki last April. This example acts similar to a channel, where subscribers receive notifications and news from several data streams:

output_6CCft1

On this post, I explain how to build it in three steps:

Continue reading

Standard
automation, chatbots, data journalism, HTML, Javascript, social media

What I learned from bots, chatbots and channels on Telegram

After some posts on how to build bots on Facebook, I got some feedback on making a difference between bots and chatbots. On a conversation with Miquel Serrabassa, Head of Technology at the Catalan newspaper La Nació Digital, he pointed out that some bots are, in fact, channels:

“These bots lack of interaction. They are unidirectional and post automated messages, but people cannot chat with them.”

According to Telegram, users interact with bots through messages, commands and inline requests controlled by a developer (and an API). From this definition, examples can be as broad as newspaper notifications, weather forecasts, and quiz games.

I have been experimenting and testing Telegram bots with basic coding skills and this is what I’ve learned so far:

Continue reading

Standard
automation, chatbots, data journalism, Interactivity, social media

How to build a Facebook Messenger chatbot with API.ai

The previous post shows 5 tools that help to create Facebook Messenger chatbots. The platform that I liked the most was API.ai and I used it to build a bot for my Facebook Page Dinfografia .

Through intents and entities, I tried to build a basic chatbot that displays information about my resumé. I set up some keywords to answer questions around professional experience, education or hobbies:

output_bk1Rjx

Here I explain how to create the above bot in 6 steps:

Continue reading

Standard
automation, chatbots, data journalism, Interactivity, journalism, social media

5 easy tools to create Facebook Messenger chatbots

The number of chatbots has rapidly increased on social media platforms such as Kik, Telegram and Facebook. Even though some of them are just a news feed or linear conversations such as ordering a pizza, humans look for plain language when communicating with computers.

Shawar and Atwell define a chatbot system as a “software program that interacts with users using natural language. And their purpose is to simulate a human conversation.”

Developers started to use keywords and images to simulate these conversations. But from those who don’t have coding skills, here are 5 easy and friendly tools to build chatbots:

 

1. Api.ai

This tool creates an Agent (bot) composed by intents, that match user requests to actions, and entities, which group words and synonyms into natural phrases:

This slideshow requires JavaScript.

You can create as many intents as answers you want your chatbot to have. They are formed by a context of the topic, what user says, the action that the bot has to take and a speech response.

Intents and entities might seem complicated in the beginning, but the website has a testing section and it also allows the user to see if it works on Facebook in private before sending the chatbot to Facebook developers for approval.

What I like:

  • Keywords. They make conversations more flexible setting up answers for generic topics with similar words
  • Default answers when the user runs away from the conversation
  • Entities gather synonyms under the same umbrella and avoid multiple intents with similar meanings

What I don’t like:

  • Links don’t include previews
  • Cannot upload images

2. Botsify

It presents an easy dashboard with two main blocks: design and develop. The first one creates the welcome text, buttons, and templates for the messages. The second column transforms these messages into interactions.

This slideshow requires JavaScript.

What I like:

  • Easy to upload images
  • Links and previews work
  • Easy templates for the messages

What I don’t like:

  • Conversations are less flexible and more linear
  • Templates only allow a limited number of characters

3. Manychat

This platform requires logging in with the Facebook account to choose a page that we manage.

It has an easy dashboard to create default text, keywords, schedule posts or set up source channels such as Twitter or RSS links to auto post messages.

This slideshow requires JavaScript.

Bots on this platform can be build in two or fifty minutes, depending on the complexity and the information that you want to display.

What I like:

  • Autoposting channels
  • Easy to set up keywords 
  • Possibility to schedule posts

What I don’t like:

  • Linear conversation
  • Difficult to connect replies and topics

4. Botsociety

A user-friendly platform that presents the information on a mobile to see how it will look like.

Messages are not complicated to run and they can contain images and buttons. The free plan includes a link to preview the conversation while the premium one includes a video and a GIF that summarises the bot features.

This slideshow requires JavaScript.

What I like:

  • Easy to upload one or more images
  • Buttons and links
  • Share the link with other users to see how the bot works

What I don’t like:

  • Cannot set up keywords
  • Linear conversation

5. Wit.ai

This is the only platform that allows users to log in with the Github account and seems to be focused on people who have some coding skills.

Bot replies include functions, variables, and commands that give the conversation more interactivity.

Moreover, this conversation can be stored as an API and the data can be shared or downloaded.

This slideshow requires JavaScript.

What seems more complex in the beginning makes a better result when the chatbot follows the conversation with the user.

What I like:

  • More ‘natural’ and flexible conversations
  • API feature to store and download the data
  • Entities and keywords
  • Recipes to solve problems and manage the app
  • Easy to fork apps from other users

What I don’t like:

  • Variables and functions seem confusing in the beginning
  • Cannot upload images 

 

Nieman published last year Automation in the Newsroom, a report on how algorithms are helping journalists to cover news and reach audiences. It concludes that the main challenge is how to solve technical rather than content errors:

Like any human reporter, robot journalists need editors. But the challenge of editing automatically generated stories isn’t in correcting individual stories; it’s in retraining the robot to avoid making the same mistake.

Do you have more examples? Let me know in the comments or on Twitter at @mcrosasb

Continue reading

Standard
CSS, data, data journalism, data visualization, HTML, Javascript, maps

How to: build and customise interactive maps on Mapbox

Mapbox is an open source platform that allows users to create, customise and embed maps on websites and visualisations. Their developing tools such as APIs and libraries offer a great interactivity for experienced and beginners developers.

output_8iEyPG

Here I explain how to build and share the above map in 6 steps:

Continue reading

Standard
data, data journalism, data visualization, HTML, Interactivity, maps

How to: create maps with interactive tables from Google spreadsheets

I just discovered Awesome Table, a tool that allows users to visualise Google sheets into maps, tables, graphics, cards, etc. without coding skills.

This gadget contains multiple extensions that make interactivity easy. Geocode, for instance, is an add-on that geolocalises data from the spreadsheet and creates a map with interactive tables.

Here I explain how to do it in 6 steps:

Continue reading

Standard