tactile

DT: Builder Experience

Hey everyone, welcome to another Stonehearth Desktop Tuesday! Today let’s take a closer look at Alpha 24’s building editor. Before I start, I should super clarify that this builder is not yet in your hands because we’re only just starting to work through major feedback and issues from our internal playtests. If we release it to you in this state, your million bug reports and questions would probably drown us. Hopefully this will change soon, because your towns are amazing and we can’t wait to see what you do with this tool, but until then, let’s look specifically at how User Experience Designer Nikki created the cohesive building experience we’ll all be using soon.

Better Builder UX

Recap from the video:

From Nikki’s very first experiences with Stonehearth, she’s known that the builder was her number one priority: based on the number of beautiful towns you all put out, creating and watching buildings come together is one of Stonehearth’s core joys, and based on all the feedback about UX and bugs you give us, also one of its deepest pain points. She knew that if she could just understand both, she could make the game a million times better for everyone.

So what are the existing builder’s major pain points, so we never repeat them? Well,
One it has a huge learning curve. You must know a specific mental model in order to make progress, basically that you lay out floors, then grow walls, then attach roofs. If you try to do this in any other order, you will fail. Some people have of course spent 10s or hundreds of hours on the tool and learned to create things of jawdropping beauty, but this mastery is expensive, and as developers, it’s a barrier we would prefer people not have to hurdle in order to enjoy the game.

The second of the builder’s pain points is that it’s completely unforgiving. If you make a mistake with the mental model, you have to start over because undo is wonky and there are no tools to adjust things by 1 voxel left/right/up/down.

Finally, the builder is a pain because it offers you no feedback about what you’re doing that goes against the model: there is no warning that the builder cannot handle interior walls, for example, and there is no indication that you’ve designed something that is unbuildable.

Fixing these things, however, isn’t enough to make an amazing experience; the kind that is so intuitive that you wonder why you didn’t just think of it first A good experience starts with solid design principles tailored to the player and their goals, so that the developers can prototype tons of different interactions and figure out why some feel better than others. So Nikki played with lots of 3D creation tools and came up with the following experience goals for SH’s builder:

  • That it be a toybox for the imagination
  • That it be active and hands on
  • And finally simple yet powerful

But how do you take a goal and create a design? Well, she thought a lot about how people think about structures, and concluded that in Stonehearth, people design structures to fill a purpose: a house is a bedroom/workshop; a warehouse is full of stockrooms sorted by type, an inn is bedrooms and a common area. Buildings, therefore, are made for purposes, and purposes are embodied by rooms. Making a building is the act of chaining together rooms, and filling those rooms with decorative and functional things.

So this is why, in the new building editor, the floor and grow walls tools have been consolidated into the room tool, and all floorplans are built from there.

Next, Nikki established some ground rules for building: for example, that buildings must be connected to the ground by at least one voxel, and rules for the UI interactions, such as the idea that all actions that the player takes should have some for of reaction: placing things provides animation and sound, or that unplaceable/unbuildable things telegraph themselves via color.

Finally, she identified that basic interactions in the building experience should be tactile: dragging, resizing, etc should be done on the room or wall in question, supporting the toybox feel by giving you the sensation of having physically manipulated the object.

At the same time, other interactions like choosing from a giant array of things, would require a different, palette based interaction model, one that would appear in context when needed and disappear when not.

The end result, which you can see in her first few photoshop sketches, is a building UI design that is incredibly minimalist. A few controls like the basic tools, the build button, the cost button, and undo/redo are always present at the edges of the space, but for the most part, the players’ attention is in the center of the screen, where the building is. Palettes for materials, colors, decor, and options appear when wanted, and disappear when not.

Chris and Justin then took Nikki’s basic mockup and implemented a fast, ugly version of it in the UI of the game, side by side with the existing old builder editor, just so we could test that the basic interactions worked. Nikki then went through and made icons for all the buttons, and Justin is in the process of doing a CSS and polish pass on it.

One thing that I’m personally very excited about is the fact that when you’re building, the building is now the most solid thing in the world, and the whole background is fuzzed out. This is the opposite of the old building UI where the building, as a blueprint, was semi-transparent, making it super hard to figure out what voxel you were editing or hanging stuff on. Though we did this to indicate that the building wasn’t finished yet, it was the exact opposite of what people needed to make solid design decisions.

In our first playtest of the new builder, we as a team were incredibly excited to see Chris’s new infrastructure, the new tactical interactions, and the new UI come together at last into the cohesive experience Nikki imagined when she first set out on this journey. Of course, we discovered a number of bugs and oversights: like the fact that fixtures must be built along with the walls in order for hearthlings to make progress, meaning that if you haven’t placed a carpenter’s bench, your hearthlings will not be able to proceed with the structure, or the fact that multiple structures can very easily all be part of “the same building” creating construction surprises, or some baffling hard crashes in the nav grid code. Stairs and roofs have a few weirdnesses going on with them as well, in how they join together or merge with their parent structure. And of course, we haven’t yet fully integrated building with terrain, so hearthlings don’t yet dig the buildings one voxel into the ground–something we intend to add as we fix these other issues. The team is working super hard on all these things now, because we can’t wait to see what you do with this huge update to one of our favorite parts of the game.

Other Announcements

This week’s Thursday 6:00pm PST stream will feature Artist Allie, some come with all of your modeling, styling, and Stonehearth-thematic questions!