tutaski.blogg.se

Diablo 3 user interface
Diablo 3 user interface








Designing an interface for gamepads requires decisions to be made regarding what directions the user can navigate in and which of the limited inputs will be used for navigating each element of the interface. While technically possible, this layout is not ideal for gamepad navigation. Inventory screens from Diablo and Diablo 2. I added this back in, which reduced the overall height of my inventory panel by 56px.

  • Finally, it turns out I missed something in my design - Blizzard reserves a section underneath the UI panel for additional input prompts or instructional text.
  • The increased inventory capacity didn’t survive the rest of the changes, but I did explore alternative solutions to the single slot items, which you’ll see later on.
  • This change also allowed me to move the power attributes back into the character panel. I decided to use tooltips instead of accordions, which freed up space and increased the ability to show varying amounts of data. I could only fit up to 4 stats under each attribute, and this method didn’t work out the way I’d hoped.
  • The expanding accordions for character attributes proved to be too rigid.
  • The triggers and bumpers typically lead to left/right navigational thinking, not up and down, so I reverted to a horizontal tab bar.
  • The vertical tabs to the left of the inventory did not flow well with the psychology of gamepad navigation.
  • Changes to other elements allowed these to move back to their original position in the right character panel.
  • Many comments I received fought against my initial instinct to move secondary power attributes (Angelic, Demonic, Ancestral) to the character preview panel.
  • The ring equipment slots didn’t need to be smaller than the other slots.
  • The expanded character details section (which showed the character name, class, and level) worked well, so I kept it.
  • I kept the increased size of the sort button and it’s label, but this needed to move with the tabs, so I moved it back to the original position in the top right of the inventory panel.
  • Many agreed that equipped weapons deserved a larger treatment in the character preview panel.
  • Adjusting the equipped slots in the character preview to be completely symmetrical made it easier to estimate the navigation grid.
  • Here are some of the things I learned about what did and didn’t work in my interface: These discussions led to some revelations about why Blizzard made certain decisions and further reinforced the benefits of their approach to the interface.

    diablo 3 user interface

    After posting my designs, I received some valuable feedback from the community.










    Diablo 3 user interface