追求卓越追求完美規范學習
The golden ratio is originally a mathematical term. But art, architecture, and design are inconceivable without this math. Everyone aspires to golden proportions as beautiful and unattainable perfection. By visualizing data, we challenge ourselves to strike a balance between design and analysis; finding a similar harmony in the visual perception of a graph much like the harmony of the golden ratio in the world around us. How do we bring numbers and dry logical conclusions to life? How do we get them to tell a fascinating story without losing its meaning? Perhaps we can consider this the “new” Golden Ratio.
黃金比例最初是一個數學術語。 但是,沒有這種數學,藝術,建筑和設計是不可想象的。 每個人都渴望獲得美麗和無法達到的完美的黃金比例。 通過可視化數據,我們挑戰自己,在設計和分析之間取得平衡。 在圖形的視覺感知中找到相似的和諧,就像我們周圍世界的黃金比例的和諧一樣。 我們如何將數字和干燥的邏輯結論帶入生活? 我們如何讓他們講一個有趣的故事而又不失去其含義? 也許我們可以認為這是“新的”黃金分割率。
In search for the answers to these questions, I investigated the best examples of modern data visualization by searching through the category “Greatest” in the Tableau Public gallery of works. The work “How Safe Are Ivy League Schools?” by authors Alex Dixon & Tarannum Ansari caught my eye. The authors asked the non-standard question: How safe is it to study at Ivy League universities?
在尋找這些問題的答案時,我通過在Tableau公共作品庫中搜索“最偉大”類別來研究現代數據可視化的最佳示例。 常春藤聯盟學校有多安全? ”作者Alex Dixon和Tarannum Ansari引起了我的注意。 作者提出了一個非標準的問題: 在常春藤盟校學習安全嗎?
For those unfamiliar, the Ivy League is an association of the eight oldest American universities — often used as a shorthand for prestigious higher education in the United States. To answer their question, the authors used open data on the website of the US Department of Education.
對于那些陌生的人來說,常春藤聯盟是美國八所最古老大學的協會,通常被用作美國享有聲望的高等教育的簡寫。 為了回答他們的問題,作者使用了美國教育部網站上的開放數據。
Despite the age of the visualization (it was released in 2017 and features data from 2001–2014), I decided to choose this piece for my investigation of the balance between analysis and visual design. I believe that paying attention to nuances that can confuse users is the best way to learn how to avoid misleading context in my own work, as well as to discuss differences in perception with other specialists.
盡管可視化的年代很久(它于2017年發布,并具有2001-2014年的數據),但我還是決定選擇此作品來調查分析與視覺設計之間的平衡。 我認為,關注可能使用戶感到困惑的細微差別是學習如何避免在我自己的作品中產生誤導性上下文以及與其他專家討論看法差異的最佳方法。

報告格式 (Report Layout)
At first glance, it’s pleasing that the visualization is made with the ideology of a dashboard — on one screen without scrolling. Three vertical logical blocks are highlighted:
乍看之下,令人愉悅的是,可視化是通過儀表板的思想進行的–在一個屏幕上無需滾動。 突出顯示了三個垂直邏輯塊:
- for administrative violations, 對于行政違規,
- for administrative penalties, 對于行政處罰,
- for criminal offenses. 刑事犯罪。

Vertical blocks are united by a horizontal strip at the top: eight logos and the short names of the universities. The logos make it possible to reference the universities throughout the dashboard without having to rely on the written name. The logos also work as filters: by clicking, you can select the desired university and view only its information.
垂直塊由頂部的水平條組合在一起:八個徽標和大學的簡稱。 徽標使您可以在整個儀表板中引用大學,而不必依賴書面名稱。 徽標也可以用作過濾器:通過單擊,您可以選擇所需的大學并僅查看其信息。
Under the logos there is a time slicer by years — you can select the period of interest and the data will update accordingly. Traditional and understandable visual solutions are used for visualization:
徽標下有一個按年劃分的時間切片器-您可以選擇感興趣的時間段,數據將相應地更新。 傳統且易于理解的視覺解決方案用于可視化:
- bar chart, 條形圖
- filter with a choice from the drop-down list, 從下拉列表中選擇一個選項進行過濾,
- heat chart, 熱圖,
- area diagram. 區域圖。
字體和配色方案 (Fonts and Colors Scheme)
The authors use fonts very skillfully: two catchy bold fonts are chosen for the headers and a concise, well-read sans-serif font for the description and numbers.
作者非常熟練地使用字體:標題選擇了兩種醒目的粗體字體,描述和數字選擇了簡潔易讀的sans-serif字體。
The color scheme is a harmonious combination of milky cream and green (perhaps as a reference to the color of ivy leaves). While from a design standpoint this color palette is quite pleasing, it raises a few questions for our inner Analyst. For many people green is intuitively perceived as positive — the greener the better. Accordingly, a saturated green color should indicate a more positive situation (low level of danger). As a result, some users may potentially be confused due to the choice of this palette.
配色方案是乳白色和綠色(可能是常春藤葉顏色的參考)的和諧組合。 從設計的角度來看,此調色板非常令人滿意,但它給我們的內部分析師帶來了一些問題。 對于許多人來說,綠色在直觀上被認為是積極的-綠色越好。 因此,飽和的綠色應表示更積極的情況(危險程度低)。 結果,由于選擇此調色板,某些用戶可能會感到困惑。
In addition, the heat map visualizations have a somewhat confusing color logic, which leads to color and data conflicts. For example, the data for Cornell University is distributed as follows:
此外,熱圖可視化還具有一些令人困惑的顏色邏輯,從而導致顏色和數據沖突。 例如,康奈爾大學的數據分布如下:
- 100–200 offenses — standard green, 100–200次進攻-標準果嶺,
- 200–500 offenses — light green color, 200–500次進攻-淺綠色,
- over 500 offenses — dark green color. 超過500次進攻-深綠色。

What could make the Analyst feel a little more comfortable? Perhaps adding an alternative red spectrum color to the report to create a transition between negative and positive. And this color exists. The Ivy League has several signature colors and one of it — Harvard crimson — just the “crimson” shade we need.
是什么讓分析師感到更舒服? 也許在報告中添加其他紅色光譜顏色以在負值和正值之間創建過渡。 并且這種顏色存在。 常春藤盟軍有幾種標志性的顏色,其中之一是哈佛深紅色,這正是我們需要的“深紅色”色調。
Please note: This solution is not the best for all people due to color vision deficiency (CVD). It is just one of the suggestions to make the visualization more clear, though one should always check to ensure a viz is using colorblind-friendly palette to avoid misunderstandings due to color perception (for example, Color Blindness Simulator)
請注意:由于色覺不足(CVD),此解決方案并非對所有人都適用。 這只是使可視化效果更清晰的建議之一,盡管應該始終檢查以確保可視對象正在使用對色盲友好的調色板,以避免由于色覺而引起的誤解(例如,“ 色盲模擬器” )。
可視化:分析師感到困惑 (Visualization: The Analyst is Confused)
As already mentioned, simple and intuitive graphs have been chosen for the visualizations. The authors brilliantly managed to reflect a large amount of data without excessive fragmentation and visual weight. Pop-up tips played a significant role — there are lots of them and they are quite informative.
如前所述,為可視化選擇了簡單直觀的圖形。 作者出色地設法反映了大量數據,而沒有過多的碎片和視覺負擔。 彈出提示起著重要作用-其中很多提示都非常有用。
However, there is an ambiguous logic in the choice of the measurement which crosses out all the ease of the visual perception for the Analyst. The authors chose absolute values as the unit of measurement: the total number of violations or offenses. It seems to me that it’s not entirely informative to use absolute values in such studies.
但是,在選擇度量時存在一個含糊不清的邏輯,這種邏輯與分析人員的所有視覺感覺都難以相提并論。 作者選擇絕對值作為度量單位:違法或違法的總數。 在我看來,在此類研究中使用絕對值并不完全有益。
For example, 691 law violations were committed at Cornell University in 2014 — is this a lot or a little? It seems to be a lot. That same year there were only 386 violations at Dartmouth College. It looks like things are really going bad at Cornell University after all, doesn’t it? Moreover, the current logic of the heat map tells us this too— Cornell University is shown with darker green than Dartmouth College.
例如,2014年在康奈爾大學犯下了691起違反法律的行為-是多少? 似乎很多。 同年,達特茅斯學院只有386起違規事件。 畢竟,康奈爾大學看起來真的真的很糟糕,不是嗎? 此外,熱圖的當前邏輯也告訴我們這一點–康奈爾大學的綠色深于達特茅斯學院。

But this conclusion may be wrong. To fully understand the situation, I would recommend taking into account the total number of students. And the authors have this data — when you hover over the histograms (left visual block) informative tips with this data for each university appear.
但是這個結論可能是錯誤的。 為了充分了解這種情況,我建議考慮學生總數。 作者擁有這些數據-當您將鼠標懸停在直方圖(左圖塊)上時,就會出現每所大學的數據提示性提示。
So, 691 law violations occurred at Cornell University, which has 21,679 students, and 386 law violations occurred at Dartmouth College with 6,298 students. That’s 31.9 law violations per 1,000 students at Cornell University and 61.3 law violations per 1,000 students at Dartmouth College — with a convincing advantage… Cornell University wins!
因此,康奈爾大學發生了691起違反法律的行為,有21,679名學生,達特茅斯學院發生了386起違反法律的行為,有6,298名學生。 這就是康奈爾大學每1,000名學生違反法律的31.9例,達特茅斯大學每1000名學生違反法律的11.3項–具有令人信服的優勢……康奈爾大學獲勝!
The authors do attempt to compensate for this difference in volume in the bar graphs on the left, which use thickness to designate the number of students. However, this makes the visual less readily understandable at a glance and adds more cognitive load to the reader.
作者的確嘗試補償左側條形圖中的音量差異,該條形圖使用厚度來指定學生人數。 然而,這使視覺一眼就不易理解,并給讀者增加了更多的認知負擔。

Our internal Explorers also lacked clear color legends — at least one for each block. Finally, the Analytist tore up something else about the horizontal scale for heat maps — because it was only from the prompts that he could understand that there is aggregate year-by-year data for each of the universities.
我們的內部資源管理器也缺少清晰的顏色說明-每個塊至少一個。 最后,分析家對熱圖的水平比例進行了其他修改,因為只有從提示中他才能了解每所大學的年度匯總數據。

您批評-您提供! (You Criticize — You Offer!)
This report has deservedly entered the category “Greatest” in Tableau — the authors set a fairly complex and voluminous task and have effectively realized it. If it wasn’t for the mentioned remarks on the measurement logic and color choice, the report would be almost flawless from the user’s point of view.
該報告當之無??愧地進入了Tableau的“最偉大”類別-作者設定了一個相當復雜和繁瑣的任務,并有效地實現了這一目標。 如果不是針對測量邏輯和顏色選擇的上述說明,那么從用戶的角度來看,該報告幾乎是完美無缺的。
At the same time, we don’t necessarily get the answer to the basic question: how safe is it to study in the Ivy League? Trying to answer, our Analyst suggested the report be supplemented with a consolidated safety indicator for the entire Ivy League, also normalized to provide the data in the form of a percentage of events per 1,000 students. Our Designer enthusiastically released all that. The result of their collaborative search for the new golden ratio is this visualization:
同時,我們不一定能回答基本問題: 在常春藤聯盟學習安全嗎? 為了回答這個問題,我們的分析師建議為報告添加一個針對整個常春藤聯盟的綜合安全指標,并進行標準化,以每1000名學生事件百分比的形式提供數據。 我們的設計師熱情地發布了所有這些內容。 他們共同尋找新的黃金比例的結果是這種可視化效果:

So what do we see? The leader among all types of law violations is liquor law violations. Among the criminal offenses, burglary and robbery have a sad leadership .
那我們看到了什么? 在所有類型的違法行為中,領導者是酒業違法行為。 在刑事犯罪中,入室盜竊和搶劫行為可悲。
The already mentioned Dartmouth College and its affiliated Princeton University and Brown University are the most “red” participants in our table.
已經提到的達特茅斯學院及其附屬的普林斯頓大學和布朗大學是我們表中最“紅”的參與者。
In contrast, Columbia University in the City of New York, Cornell University, Harvard University, and the University of Pennsylvania are mostly in the safe “green” zone.
相反,紐約市的哥倫比亞大學,康奈爾大學,哈佛大學和賓夕法尼亞大學則大多位于安全的“綠色”區域。
Harvard University, however, proved to be an unexpected leader in burglary and robbery. But if you look closely at Criminal Offenses’ heat map 2001–2014, it is clear that these problems have been experienced by Harvard University in the past — since 2009, the university has moved to the “green” team and has never left it again.
然而,事實證明,哈佛大學是搶劫和搶劫領域的出人意料的領導者。 但是,如果您仔細查看2001-2014年《刑事犯罪》的熱圖,很顯然,哈佛大學過去曾遇到過這些問題-自2009年以來,該大學已轉入“綠色”團隊,并且再也沒有離開過。

結論 (Conclusions)
Modern data is called Big Data for a reason — the more data, the more difficult it is to visualize. Volumetric data requires detail, and this affects the visual component of the analysis. The original report successfully avoided visualization problems by proposing a constructive graphical solution for a massive data block.
現代數據之所以被稱為大數據,是因為一個原因-數據越多,可視化就越困難。 體積數據需要詳細信息,這會影響分析的視覺組成。 原始報告通過為海量數據塊提出了建設性的圖形解決方案,成功避免了可視化問題。

But the completeness of the data presented has replaced the analysis itself.
但是,所提供數據的完整性已取代了分析本身。
Not claiming the truth and armed with Occam’s razor (yes, analysts have a lot of surprising techniques in the arsenal), I grouped the data on crimes into the category “criminal offenses” and got rid of the details of the sanctions in “law violations”.
我沒有聲稱真相,而是用奧卡姆的剃刀武裝(是的,分析家在武器庫中有很多令人驚訝的技術),我將犯罪數據歸為“犯罪罪”一類,并擺脫了“違反法律的行為”中制裁的細節。 ”。
This allowed me to calculate aggregated security indicators, compare Ivy League universities, and find some answers. Maybe it wasn’t as elegant as the original version — that’s something for my inner Designer to think about.
這使我能夠計算匯總的安全指標,比較常春藤盟校,并找到一些答案。 也許它沒有原始版本那么優雅-這是我的內部設計師要考慮的事情。
My final word of advice — when working on data visualization switch internally from Analyst to Designer and vice versa. (Don’t forget to involve the User however, since he will be the one who will evaluate the final result.) By switching between these two modes of thinking, we work towards that perfect balance between design and analysis — our “new” Golden Ratio.
我最后的建議是-在進行數據可視化時,在內部從Analyst切換到Designer,反之亦然。 (但是,不要忘了讓用戶參與,因為他將是評估最終結果的人。)通過在兩種思維方式之間切換,我們努力在設計和分析之間實現完美的平衡-我們的“新” Golden比。

翻譯自: https://medium.com/nightingale/in-pursuit-of-a-new-golden-ratio-1ad528534222
追求卓越追求完美規范學習
本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。 如若轉載,請注明出處:http://www.pswp.cn/news/390527.shtml 繁體地址,請注明出處:http://hk.pswp.cn/news/390527.shtml 英文地址,請注明出處:http://en.pswp.cn/news/390527.shtml
如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!