League of Legends (Tutorial) Usability Review

League of Legends, by Riot games, is a third-person MOBA using three games modes: Summoner's Rift, Twisted Treeline, and Howling Abyss. There are two tutorials. After the first tutorial, players can choose to do another tutorial-like training. If they accept, players select one of three “champions” who each have unique abilities. Teams consist of 5 players with the goal of destroying the opposing team's nexus.

With over 67 million players every month, it is a top game for any MOBA player. With such high playing traffic, it is important to assess the usability of the game’s tutorial. Although I have some previous experience with MOBAs (Heroes of the Storm), the steep learning curve of League of Legends was slightly overwhelming.

After completing the tutorial for the game, I was brought to another tutorial level as an introduction to “Summoner's Rift”. Unlike the first tutorial, which teaches you the basic mechanics of the game, the second tutorial has you play with 4 other bots against the AI.

The primary usability problems with the tutorials involves the character loadout screen and item-buying mechanism. The first loadout screen has many voice/text introductions to what everything on the screen does. Some of the information is easily forgotten as it is not yet applicable, such as the “Runes” and “Masteries” tab.

Character Loadout Screen 

After accepting the battle training tutorial, I was brought to the above screen. By the time I finished selecting my character and waiting to play, there had been 17 information boxes accompanied by voice instructions.

This felt slightly overwhelming, although it did help that I had to select “Continue” on most boxed in order to progress, so I could take in most of the information at my own pace. By the time I was ready to play, I felt only slightly less confused than when I began.

The issue of the vague information about such items as “Runes” and “Masteries” combined with trying to figure out the previous information regarding selecting spells made it overwhelming. This is because selecting a spell prompts the instructions to move forward before you can select two spells.

Although there are only two spells available for the first game, there is no intuitive confirmation that tells the player they have selected the spells. I had been waiting for something to tell me I had selected the spell I clicked on. Because of this, I was stuck trying to ensure that I had selected two spells and ignoring the information that the tutorial had moved on to. The images below demonstrate this chain of action.

Spell Explanation

↓

Select Spell

↓

 Selecting first spell

↓

Immediately after selecting first spell

Rather than a notification indicating the spell you had selected, the number “1” is shown on the first spell icon that is selected. After this selection is made, the number “2” is shown on whatever spell icon you select subsequently. This is slightly confusing since the spells selected do not give confirmation nor are they highlighted.

Recommendations:

●     Continue to the information boxed to use “Continue” button in order to allow the individual progression throughout the tutorial. (Moderate)

●     Highlight the spells that were selected or include some sort of confirmation.(Moderate)

●     When instructing the player to select items (such as spells), wait for the player to select both spells before moving on to the next instructional piece. (Severe)

Purchasing items

The biggest issue is the lack of information on improving your champion through purchasing items, especially when players buy items in real-time. After completing the initial tutorial and moving into the battle training phase, I had minimal knowledge of what items to purchase.

After playing the battle training for several minutes, I noticed I had less kills than the other bots I was playing with. Using the tab button to look at my kills/deaths/assassins, I noticed that the other team members had more items than I had.

After going back to the base to purchase more items, I was not sure which items to purchase. My ignorance, combined with pressure of purchasing items in real-time exacerbated the stress of quickly selecting an item.

I thought the most reasonable thing to do would be to start at the top and select items from each line moving downward since each line below the last had one more item, giving it the look of progression. Notice the arrows between items. I found these easy to miss partly because I was eagerly looking for any way to categorize items and partly due to wanting to select an item as quickly as possible so I could get back to the action. It was also easy to gloss over the text located above each row of item icons that explain what purchasing these items will help upgrade.

Recommendations:

●     Fit somewhere into the first tutorial that items affect each hero differently and certain types of heros may want to focus on certain items over others. (Minor)

●     Have items displayed in a way that is categorized so the player can easily tell which category an item belongs to, such as highlighting the text above each item row. Right now it blends in with the dark background. (Moderate)

Final Thoughts:

Overall, the league of Legends tutorial does a decent job at introducing new players to the game. It would be ideal for players to have more of a chance to further their skill level and understanding of the game prior to jumping in with other players.

The current setup between the formal tutorial and the PVP option helps players in this way: by forcing players to work up to level 3 before being allowed to play PVP. Players are allowed to play with other teammates against AI’s until they level up, giving them more of a chance to familiarize themselves with the game. As a MOBA player, I’m excited to keep playing and learn more about the game!