維多利亞3開發(fā)日志#29 | 1/12 用戶體驗

牧游社 牧有漢化翻譯
Victoria 3 - Dev Diary #29 - User Experience
Hagerhink, UX Designer
(譯注:鑒于本篇日志附圖主要為用戶界面展示,對于圖片中內(nèi)容不多作翻譯。)
Hello, my name is Henrik and I am a UX Designer on PDS. I have been a part of the Victoria 3 team for almost the entirety of the project, and since I am about to take a few months of parental leave I wanted to leave you with a brief summary and overview of the thoughts and ideas that form the foundation of the User Experience (UX) design in our game. Also, say hello to Aron whom I have written this dev diary in cooperation with. Aron has been my UX padawan for the past year and will be shouldering the UX while I am gone.
大家好,我是Henrik,是PDS的UX設(shè)計師。在項目的幾乎整個開發(fā)過程中,我都是 Victoria 3 團(tuán)隊的一員。但是我即將休幾個月的育兒假,所以我想給大家留下一篇簡述,向大家簡要概述一下,是哪些點子和想法構(gòu)建出了游戲中用戶體驗(UX)設(shè)計的基礎(chǔ)。另外,我還要向與我合作撰寫這篇開發(fā)日志的Aron問好。 在過去的一年里,Aron一直是我的在UX方面的學(xué)徒,并將在我離開時承擔(dān)UX開發(fā)任務(wù)。
First and foremost, why do we do what we do? Basically, our end goal is to make the game more approachable and accessible, so that we can make it even deeper and more complex. Complexity should not come from not knowing where to find something and why something happened, but from the deep simulation and game mechanics at the core of our game. The more accessible the information and interactions can be, the more complex we can make that information and those interactions.
首先,我們?yōu)槭裁匆鉛X開發(fā)?基本上來說,我們的最終目標(biāo)是讓游戲更加平易近人,并更容易上手,這樣我們就可以將它做得更深入、復(fù)雜。復(fù)雜性不應(yīng)該來源于找不到東西在哪和這些東西為什么會發(fā)生,而是應(yīng)該來自我們游戲的核心機(jī)制的深度模擬。信息和交互更容易取得,也就更容易被做得更復(fù)雜。
In order to get there, we have three UX Pillars
為了實現(xiàn)目標(biāo),我們總結(jié)出三個UX的開發(fā)支柱:
1. The right information at the right time
1. 在正確的時間提供正確的信息
2. Clear feedback about cause and effect
2. 清晰的因果反饋
3. Clearly separate Actions from Information
3. 明確區(qū)分行動與信息
What tools do we have at our disposal to provide a user experience that satisfies these lofty goals? In this Dev Diary we will walk you through some of our main tools and approaches.
哪些工具可以用來提供足以實現(xiàn)這些崇高目標(biāo)的用戶體驗? 在本篇開發(fā)日志中,我們將向你介紹我們的一些主要工具和方法。

Nested tooltip, as made famous by Crusader Kings 3
由十字軍之王3而聞名的嵌套提示框
There is one piece of technology we can not see this game without: Nested Tooltips. We use it both for Game Concepts, and for getting more detailed breakdowns of numbers, and boy do we have numbers! This allows us to achieve parts of the first UX Pillar, The Right information at the right time. Instead of having to explain every single detail and anecdote in a single humongous tooltip, we can focus on the most essential and important information for the current context and leave any information that might not be directly tied to this context for the nested tooltips to cover. This is crucial in Victoria 3 where every single thing affects a whole bunch of other things, some very important and others simply knock on effects.
在討論這個游戲時,嵌套提示框是一項我們不能不提的技術(shù)。我們既將這個工具用于游戲概念Game Concepts,也用來獲得數(shù)字構(gòu)成的詳細(xì)分解——諸位我們當(dāng)然有數(shù)字了!這使我們能達(dá)成第一個UX 開發(fā)支柱的目標(biāo):在正確的時間提供正確的信息。與其在單個巨大的提示框中解釋每個細(xì)節(jié)和隱情,有了嵌套提示框后,我們就可以讓我們當(dāng)前的文本關(guān)注最基本和最重要的信息,并將其余那些可能不直接關(guān)聯(lián)的信息放入嵌套提示框中,這在維多利亞3中至關(guān)重要,因為每一件事都會產(chǎn)生眾多后果,有些影響深遠(yuǎn),而有些則微乎其微。


Of course Nested Tooltips come with their own set of challenges. This is where we are happy to allow for a lot of customization and tweaking. For example, how do you want the tooltip to lock? Mouse Tendency, Timer Lock, or Action Lock? If you choose the Timer Lock, how long do you want that timer to be? Etc.
當(dāng)然,嵌套提示框也有其自身的挑戰(zhàn)。這是我們很高興允許進(jìn)行大量自定義和調(diào)整的地方。例如,玩家會希望如何鎖定提示框?鼠標(biāo)停留、定時鎖定或動作鎖定?如果玩家選擇了計時鎖定,該計時器要有多長時間?等等。

Another thing we show in these tooltips is the next thing on the agenda and what y’all been waiting for - graphs!
我們在這些提示框中還展示了在議程中的另一個工具,這也是你們一直在等待的——圖表!

Data visualization
數(shù)據(jù)可視化
One of the more challenging areas is to clearly give feedback of a value's change over time. In a game with as many interlocking systems as Victoria, giving feedback on how something has changed over time becomes an essential part of the game-loop. How can we take several values and show you exactly how it has changed over time? You guessed it, line graphs.
對隨時間變化的數(shù)值提供反饋,這是極具挑戰(zhàn)性的領(lǐng)域之一。在維多利亞這種多個系統(tǒng)互相關(guān)聯(lián)的游戲中,給出事物如何隨時間推移而發(fā)生變化的反饋是游戲循環(huán)的重要組成部分。 我們?nèi)绾翁崛〕龆鄠€數(shù)值,并準(zhǔn)確地向玩家展示它隨著時間而發(fā)生的變化呢?你猜對了,那就是用線狀圖。

We would never make a Victoria game without the proper amount of graphs and charts! (Yes, you can switch to show pie charts for the Victoria 2 purists.)
沒有適當(dāng)數(shù)量的圖表,我們永遠(yuǎn)做不出維多利亞游戲?。ㄊ堑?,你可以切換成餅圖來滿足維多利亞2原教旨主義者的要求。)



Numbers that update in real time and Predictions
實時更新的數(shù)字和預(yù)測
In most cases in our previous games, you have to tick the game in order to see the effects of things. In Victoria, we try to make all the immediate effects of your actions available the second you take them. When taking actions that have consequences spreading far and wide throughout the game's systems, it can be really hard to parse if this is a good idea or not without excessive use of spreadsheet software. So we predict things for you. (With a nested tooltip breakdown of that prediction value of course!)
在我們老游戲中的大多數(shù)情況下,玩家必須在游戲中等一段時間,才能看到事件產(chǎn)生的效果。在維多利亞3中,我們試圖在讓玩家在執(zhí)行事件的那一秒,就能夠得知行動所產(chǎn)生的即時效果。當(dāng)行動的結(jié)果會廣泛而深遠(yuǎn)地在整個游戲系統(tǒng)中傳播時,在不大量使用電子表格軟件的情況下很難分析這是不是一個好主意。因此,我們將提供預(yù)測。(當(dāng)然,使用嵌套提示欄來展示預(yù)測的數(shù)值分解?。?/p>
The Building panel provides you with all the raw building data you could ever need, for you to analyze however you like. For whatever action you may desire, we provide our warmest support in your calculating endeavors with predictions such as the Weekly Balance when changing Production Method and predicted Earnings of the building if you were to expand it.
建筑面板為玩家提供所有的原始建筑數(shù)據(jù),玩家可根據(jù)需要進(jìn)行分析。無論玩家希望采取什么行動,游戲系統(tǒng)都會為計算工作提供最熱情的支持,并提供預(yù)測,例如預(yù)測更改生產(chǎn)方法時的每周余額和預(yù)測擴(kuò)建建筑物的收益。




Focus on the Map
關(guān)注地圖
Our map is gorgeous and we want to put more emphasis on it. For example, all Events in the game have a location on the Map, and if you hover over a State name in any text, that State will be highlighted on the Map. This makes it easier to connect the names of things with their representation on the map, giving context to the text and the map. However, one of the coolest contextual information we are creating are Map Modes. We have Map Modes connected to most of our information panels, triggering when you open each panel which gives you the right contextual information at the right time. With the use of icons, numbers, and different heatmaps, we enable you to see several layers of contextual information at the same time without things getting too cluttered and without you having to scroll through a big sheet of data. Albeit, all Map Modes also exist in list form, making it possible to sort the information that is shown on the map, not entirely unlike a visual Ledger.
我們的地圖制作得相當(dāng)精美,所以我們想要在這方面著重強(qiáng)調(diào)一下。例如,所有游戲中的事件都在地圖有一個位置,而且如果你將鼠標(biāo)懸停在任何文本中的地區(qū)名字上,該地區(qū)將在地圖上被高亮顯示。這使得人們更容易將事物的名稱與它們在地圖上的表現(xiàn)聯(lián)系起來,為文本和地圖提供一個語境。我們目前做的最酷的背景信息之一就是地圖模式。我們有各種地圖模式來連接我們絕大部分的信息面板,打開每一個面板都會在正確的時間給你正確的背景信息。通過使用圖標(biāo)、數(shù)字和不同的熱圖,你就能同時看到幾層的背景信息,而不會顯得太雜亂,也不用滾動瀏覽一大張數(shù)據(jù)表。當(dāng)然,所有的地圖模式也可以以列表形式存在,從而實現(xiàn)對地圖上顯示的信息進(jìn)行分類,完全就像一個可視化的賬簿。


The Lenses
鏡頭
Every action you can take on the map, you can take from the five Lenses. Production Lens, Political Lens, Diplomatic Lens, Military Lens, and Trade Lens - each Lens comes with its own Map Mode! Basically, it is like viewing your country from a specific point of view.
你在地圖上采取的每一個行動都可以通過五個鏡頭來實現(xiàn)。生產(chǎn)、政治、外交、軍事、貿(mào)易,每一個鏡頭有它自己的地圖模式!基本上,這就是從不同的角度審視你的國家。



Right-Click menus
右鍵菜單
The Map Interactions in the Lenses are our take on the Macro Builder, that is when you know what action you want to take and then you select what type of entity to perform that action on. On the other side of the coin, we use Right-Click menus for when you know what entity you want to perform an action on and then select an action from a list of potential actions. We have this for States, Markets, Characters, Buildings, Interest Groups and Goods. So any time you see any of those in the game, you can right-click on them to get a list of actions you can perform.
我們在鏡頭中的地圖交互里采用了批量建造器Macro Builder,這樣一來,你可以在這個模式下知道你想采取什么行動,以及你可以選擇什么類型的實體來執(zhí)行該行動。另一方面,你可以從右鍵菜單的潛在行動列表中,選擇你要對一個實體所執(zhí)行的行動。國家、市場、人物、建筑、利益集團(tuán)和商品,都可以使用這一功能。因此,當(dāng)你在游戲中看到這些東西時,你可以右鍵點擊它們,從而打開行動列表。


Empty States
空白狀態(tài)
Often forgotten, but extremely important. This is the feedback of dead ends, such as looking at the Urban Buildings tab of a State with no Urban Buildings. A useful empty state will let the player know what's happening, why it's happening, and what to do about it. In a State with no Urban Buildings we should of course tell this to the player, but also include the potential Urban Buildings which the player can build in that State. This is only one of many examples and you'd be surprised how often this simple yet important UX design aspect is forgotten. The empty state tells the player what that screen could be populated with and what the player can do about it.
雖然這一點經(jīng)常被忘掉,但卻十分重要。這是針對一些“死胡同”作出的反饋,比如查看一個地區(qū)的城市建筑標(biāo)簽頁,但卻沒有城市建筑。一個有用的空白狀態(tài)將讓玩家知道發(fā)生了什么、為什么會發(fā)生,以及應(yīng)該怎么做。在一個沒有城市建筑的地區(qū),我們當(dāng)然應(yīng)該告訴玩家這個地方?jīng)]有城市建筑,但也要告訴玩家在這個地區(qū)可以建造哪些潛在的城市建筑。這只是眾多例子中的一個,你會驚訝于這個簡單而重要的用戶體驗設(shè)計經(jīng)常被遺忘??瞻谞顟B(tài)告訴玩家這個地方可以被填充什么,以及玩家可以做什么。


Should you get an economics degree before you play V3?
你在玩V3之前應(yīng)該有經(jīng)濟(jì)學(xué)學(xué)位嗎?
Far be it from us to ever discourage anyone from getting an economics degree! Yet, despite Victoria 3's immense depth and complexity, our intention is still to allow you to learn even the most advanced concepts the game is based on as you play. One aspect of this is the tutorial, which we are putting more focus onto than ever before and will cover in detail in a future Dev Diary. Another aspect is through tooltippable Game Concepts, which work much like an integrated dictionary or rule book. Whenever you see such a Concept in text, such as Pops, Dividends Taxes, or Market Price, you can tooltip it to get an explanation of what it means and references to related concepts and mechanics. This powerful tool together with the Nested Tooltips allows us to design and explain anything in the game without writing a novel in each tooltip, and as a player, you can choose to deep dive into any peculiarities as you see fit.
我們肯定不會阻止你去拿一個經(jīng)濟(jì)學(xué)學(xué)位!不過,雖然維多利亞3非常復(fù)雜,我們的目的仍然是讓你基于游戲來學(xué)會這個游戲哪怕最先進(jìn)的概念。一個方面就是教程,我們比以往任何時候都更加重視,并將在未來的開發(fā)日志中詳細(xì)介紹。另一個方面就是通過可打開提示框的游戲概念,其工作方式很像一本綜合的字典或規(guī)則書。每當(dāng)你在文本中看到游戲概念,如人口、股息稅或市場價格,你可以其打開的提示框來獲得對其含義的解釋,以及相關(guān)概念和機(jī)制的參考。這個強(qiáng)大的工具與嵌套提示框結(jié)合起來,允許我們設(shè)計和解釋游戲中的任何東西,而不需要在每個提示框中寫一篇小說。作為一個玩家,你可以根據(jù)自己的需要選擇深入了解任何奇特的東西。


Accessibility features
無障礙特性
Last but not least, we can not talk about UX without mentioning Accessibility and boy are we happy to have something never before seen in any PDS game - Colorblindness mode for text! We have it on our roadmap to make this feature work with more things in the game as well. We have also worked hard to get to a point where the UI scaling should work even better out of the box than previous releases.
最后,在談?wù)撚脩趔w驗時,我們不能不提到無障礙特性,而且我們很高興我們擁有在任何PDS游戲中前所未見的東西——文本的色盲模式!我們有一個路線圖,意圖讓這個功能在游戲中的更多地方發(fā)揮作用。我們還在努力工作,以改善UI縮放的效果,使其比以前的版本更好。
Default mode, Tritanopia mode, and Protanopia/Deuteranopia mode
默認(rèn)模式,藍(lán)色盲模式,以及紅色盲/綠色盲模式。


That's all for the first dev diary of 2022 folks. What an exciting year we have in front of us with so many tooltips to design and improve on! We’ll be back next week where Kenneth, our 2D Art Lead, will guide you through a closer look at the UI design of Victoria 3. See you then!
2022年的第一篇開發(fā)日志就到此為止,伙計們。我們接下來的這一年是多么令人激動啊,有這么多的提示框需要設(shè)計和改進(jìn)!我們將在下周回來,屆時我們的2D美術(shù)總監(jiān)Kenneth將指導(dǎo)你仔細(xì)觀察維多利亞3的UI設(shè)計。到時見!
翻譯:萊恩希德公爵 鏗爾舍瑟
校對:三等文官猹中堂
歡迎關(guān)注UP主和主播小牧Phenix!
歡迎關(guān)注牧游社微信公眾號和知乎專欄!微信公眾號改版為信息流,歡迎【置頂訂閱】不迷路,即時獲得推送消息!
B站在關(guān)注分組中設(shè)置為【特別關(guān)注】,將會在私信內(nèi)及時收到視頻和專欄投稿的推送!
歡迎加入牧有漢化,致力于為玩家社群提供優(yōu)質(zhì)內(nèi)容!組員急切募集中!測試群組822400145!? ?