基于WolframAlphaAPI的科學計算器原型設計

個人參與的工作及貢獻

• 與同伴進行產(chǎn)品設計理念的討論
• 進行相關用戶調(diào)研
• 產(chǎn)品整體結構的構建和架構分析
• 構思并實現(xiàn)產(chǎn)品的布局排版和原型
• 對交互效果以及功能進行了反復調(diào)試
• 制作界面介紹圖片和整理項目文案

一、簡介與平臺選擇

Wolfram Alpha

Wolfram Alpha是由Wolfram Research開發(fā)的計算搜索引擎。該在線服務提供了有關事實性問題的答案，而不是通常的搜索引擎所提供的鏈接列表。Wolfram Alpha于2009年5月18日發(fā)布，基于以前的產(chǎn)品Mathematica，該計算平臺集成了代數(shù)，數(shù)值，符號，統(tǒng)計計算功能以及圖形顯示功能

Wolfram Alpha提供的答案不包含鏈接，而是包含圖形，圖表，表格和圖形。它不僅會提供確切的答案，還會顯示一個有序的頁面，其中包含來自經(jīng)過驗證的來源的其他信息。

這種基于數(shù)學模型和算法的搜索引擎可能是語義網(wǎng)中的理想選擇。

原型設計理念

經(jīng)過短時間的討論，并結合我們團隊的開發(fā)經(jīng)歷，最終決定選擇計算器題目進行設計。和普通的計算器一樣，主界面包含基礎按鍵[1]和算式輸入框[2-1]和結果輸出框[2-2]，方便普通用戶在日常生活中，可以快速的使用本產(chǎn)品進行簡單的計算。

其次我們加入了一個擴展界面[4]，用于顯示從WolframAlpha獲取的科學計算過程與計算結果、函數(shù)圖形等，用于滿足專業(yè)用戶的科學計算需求。

（組件標號請參考附件-模塊介紹圖）

理想支持平臺

初期界面設計風格簡譜，計劃用于Web端和Windows、Linux、MacOS、Android9.0+、IOS等主流系統(tǒng)。其中對于屏幕尺寸狹小的移動端，計劃使用滑動方式來拉出擴展界面。

二、原型設計工具的選擇

理念及思路

我們在設計原型的時候一是要提升原型設計的合理性，二是要減少原型設計所占用的時間。因此，我們隊伍在明確了產(chǎn)品需求之后各司其職分工合作。

對目前常用的原型設計工具進行橫向對比

我們分別依次嘗試了墨刀,Axure,Mockplus等軟件，從他們的特色功能、性價比、學習曲線等多個角度進行了分析。

Axure

AxureAxure RP是美國AxureSoftware Solution公司旗艦產(chǎn)品，是一款快速的產(chǎn)品原型設計工具，讓負責定義需求和規(guī)格、設計功能和界面的專家能夠快速創(chuàng)建應用軟件或Web網(wǎng)站的線框圖、流程圖、原型和規(guī)格說明文檔。作為專業(yè)的APP原型設計工具，它比一般創(chuàng)建靜態(tài)的原型設計工具要快速、高效。它具有強大的交互效果,同時方便多人協(xié)作,有著便利的版本控制管理和動態(tài)面板,此外還有豐富的控件元素。

但相較而言,Axure的學習成本較高,熟練掌握所需要的時間更長,它的價格也是勸退我們的一個理由。

墨刀

墨刀的定位是主要用于設計移動APP原型，其控件的拖拉、大小的調(diào)整，都會自然去匹配相應的母版大小，非常人性化。再者，墨刀提供了強大的共享創(chuàng)建功能，方便用戶的手機上預覽原型。

但我們認為缺點在于對交互效果、控件組合、操作面板的選擇都不如Axure靈活，內(nèi)置交互效果包括點擊、滑動、滾動等，做高保真原型的時候不夠用；另外，效果切換因為是采用連線的方式，有時會讓用戶產(chǎn)生錯亂的感覺。

Mockplus

Mockplus是一款簡潔快速的原型設計工具。適合軟件團隊、個人在軟件開發(fā)的設計階段使用。其低保真、無需學習、快速上手的特點簡直是為我們這樣的初學者量身打造，而且它的功能夠用并能夠很好地表達自己的設計，滿足眾多的工作需求。有別于Axure的繁復，Mockplus致力于快速構建和迭代原型，為設計者提供簡潔高效的設計方式。相較于Axure的厚重，Mockplus更顯輕盈。而且它的學習成本較低，學習曲線平滑，方便我們快速上手完成任務，同時它的價格也是十分親民，假如日后有需求的話我們購買起來負擔會小很多。

綜合考慮，我們最終選擇了Mockplus作為我們團隊的開發(fā)工具。

三、界面模塊與功能介紹

主界面

按鈕組（對應模塊介紹圖模塊1）

主界面上的最大的交互集成模塊，由30個按鈕組成，其中包括26個常用數(shù)學按鈕和4個特殊按鈕。按鈕排列參考了一些人體工學文獻，每一個按鈕單獨綁定了邏輯函數(shù)與動畫效果，按鈕個體之間相對獨立，用戶可以通過點擊按鈕操作程序。

常用數(shù)學按鈕（26個）

用戶可以通過點擊，來對輸入框的算式追加輸入，起到和從鍵盤輸入一樣的效果。

這些按鈕包括：

• 數(shù)字按鈕 \([0-9],[.]\) 和 \([00]\)；
• 特殊符號按鈕 \([\pi],[e]\)；
• 運算符號按鈕 [^]\(,[\%],[(],[)],[!],[/],[*],[-],[+]\)；
• 三角函數(shù)按鈕 \([sin],[cos],[tan]\)；

特殊按鈕（4個）

特殊按鍵判定的并不是簡單的輸入，而是特殊的邏輯操作。

• 按鈕 \([清空]\)（對應模塊介紹圖中組件[1-1] ）：
  • 正如名字所述，按下后會清空輸入?yún)^(qū)和輸出區(qū)的內(nèi)容。按鈕配色為紅色，用來區(qū)分于其他按鍵，并且紅色可以讓人引起注意，一定程度上防止誤觸。
• 按鈕 \([退格]\)（對應模塊介紹圖中組件[1-2]）：
  • 按下功能是使輸入?yún)^(qū)中的算式退一格。配色為深灰色，同理區(qū)分其他的按鍵。
• 按鈕 \([>]\)（對應模塊介紹圖中組件[1-3]）：
  • 這個是擴展界面的展開按鈕，點擊一下后會在主窗口右側展開一個擴展界面（如模塊介紹圖-展開所示），展開之后按鈕變成 \([<]\) 收回模式，再次按下可以收回擴展界面。
• 按鈕 \([=]\)（對應模塊介紹圖中組件[1-4]）：
  • 等于號按鈕，在按下后程序將輸入?yún)^(qū)中內(nèi)容傳入后端計算，并將計算結果顯示在輸入?yún)^(qū)下方的輸出區(qū)。

文字框

這里是程序與用戶的信息交互區(qū)域和主要顯示模塊，負責顯示和記錄用戶的輸入和簡要計算結果的輸出。由輸入?yún)^(qū)和輸出區(qū)兩個文本區(qū)域組成，其中輸入?yún)^(qū)是用戶可以編輯的，用戶可以通過按鈕或者鍵盤在其中輸入算式，而輸出區(qū)是只讀組件，用戶只能復制其中內(nèi)容。

• 輸入?yún)^(qū)（對應模塊介紹圖中組件[2-1]）：
  • 輸入?yún)^(qū)是顯示用戶的輸入和可以讓用戶直接編輯的區(qū)域，使用萬用編碼（UTF-8）。一般的計算器如果想成功得到計算結果，用戶必須輸入符合算式規(guī)則的語句。但是由于我們的計算器基于WolframAlphaAPI，所以理論上算式模糊或者自然語言描述依舊可以得到計算結果。
• 輸出區(qū)（對應模塊介紹圖中組件[2-2]）：
  • 輸出區(qū)用于顯示算式的最終結果，在按下等于號之后，將后端傳來的輸入?yún)^(qū)計算結果直接顯示出來，同樣適用萬用編碼。用戶可以通過右鍵輸出區(qū)快速復制計算結果。

作者信息

區(qū)域由一些指向外部鏈接的按鈕組成，其中包括我們的各種聯(lián)系方式。

擴展界面

擴展界面只包含一個模塊——擴展模塊（對應界面模塊介紹_展開中模塊[4]）。

擴展模塊負責顯示從WolframAlphaAPI獲取的全部計算過程、科學計算結果等，采用響應式布局。

通過點擊按鈕 \([>]/[<]\) 可以展開或者收回擴展模塊。

四、參考文獻

[1] 章曲，谷林.人體工程學[M].北京：北京理工大學出版社，2009：12-17.

[2] Manuel Mateo,Marc Tarral,Pedro M. Rodríguez,Asun Galera.Ergonomics as basis for a decision support system in the printing industry [J]. Central European Journal of Operations Research, 2020, Vol.28 (4), pp.685-706.

五、附件

    1.模塊介紹圖

    2.模塊介紹圖-展開

    3.用戶調(diào)研

    4.原型演示1

    5.原型演示1-展開

    6.原型演示2

    7.原型演示2-展開1

    8.原型演示2-展開2