天天看點

個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結

這個作業屬于哪個課程https://edu.cnblogs.com/campus/xnsy/Autumn2019SoftwareEngineeringFoundation
這個作業要求在哪裡 https://www.cnblogs.com/harry240/p/11524127.html
這個作業的目标 (1)對比原型設計工具(2)需求分析(3)原型設計

Part 1 對比原型設計工具

因為之前對原型設計一點了解都沒有,是以我選擇通過對這三款軟體的第一印象以及後面的深入了解的方式來對比這三款原型設計工具的不同之處

一.墨刀MOCKING BOT

首先我們通過百度搜尋到mocking bot的有關資訊,進入下載下傳界面後可以看到這款應用軟體的相關資訊。第一直覺:界面簡潔、資訊傳遞明确。小到軟體的圖示,大到網頁的介紹我都能感受出來一股簡潔的風氣.軟體設計、互動和示範、标注與讨論、海量的素材以及雲端編輯等多樣性功能映入眼簾,給我第一感覺,是一款不錯的原型設計軟體。 下面是官網的一些圖檔

個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結
個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結

二.Axure RP

Axure RP我沒有搜尋到像墨刀那樣比較官方權威的網站,于是我先通過百度詞條的方式簡單初步了解了一下這款軟體。**Axure RP*是一款專業的快速原型設計工具,其中Axure代表美國Axure公司,RP則代表Rapid。這款軟體是一個專業快速原型設計工具,讓負責定義需求和規格、設計功能和界面的專家能夠快速建立應用軟體或Web網站的線框圖、流程圖、原型和規格說明文檔。** 然後我下載下傳了這個軟體,簡單的看了一下界面,進行了一些簡要的操作,感覺還是很好用的。下面是一些圖檔。

個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結
個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結

三.Mockplus

Mockplus這款軟體的官網是最讓我震驚以及心動的一個。不僅是因為我發現百度、中國電信、中國移動、高德地圖甚至Microsoft的團隊都有在用這個軟體進行原型設計的時候,我就感覺這個軟體絕對有獨到之處。然後我通過百度詞條查找了一下有關Mockplus的相關資訊。"Mockplus是一款間接快速的原型設計工具。适合軟體團隊、個人在軟體開發的設計階段使用。其低保真、無需學習、快速上手、功能夠用。并能夠很好的表達自己的設計。"并且Mockplus始終貫徹着"至簡即至繁"這一原則,從設計上,采取了隐藏、堆疊、組合等方式,把原本複雜的功能,精心安排。易于上手,且随着逐漸的使用,功能層層遞進,會越來越感受到這款軟體的魅力所在。 下面是官網的一些圖檔。

個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結
個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結

四.綜合對比分析

1.墨刀的功能偏向于操作與互動的簡單實作,更加适合新手上手。而且墨刀具有自動标注及切圖功能,能夠實作每個元素寬高、間距、字型顔色等資訊的一鍵制備功能。同樣墨刀的素材庫可以共享,高頻素材可以直接使用。

2.Axure rp的特點主要集中在滑鼠及鍵盤互動功能、示範文稿、新增部件樣式控制、更細化的部件屬性以及更多互動的條件。總的來說更适合進階的使用者,雖然上手起來可能不如其他兩個軟體容易,但一旦上手後是更有利于制造更加精美更加高端的産品。

3.Mockplus則和墨刀很相似,适合新手上手而且素材全面廣泛。但Mockplus也有屬于自己的創新點所在,不僅是在審閱協作、建立原型圖、批注圖釘的協同工作,而且無縫真機預覽的功能還有可直接實作設計和移動裝置之間的通訊,直接預覽,不需要任何第三方裝置。在設計過程中,設計者拿出手機就可以随時和Mockplus對接,将原型傳遞到移動裝置,觀察原型在移動裝置中的真實狀态等等,這一系列都是Mockplus的創新之處

綜合以上三點,我選擇了上手比較快的以及素材豐富,自動化程度稍微高一些的墨刀作為此次作業的原型設計工具。

Part 2 需求分析

前言:原型設計的步驟

為了能更好的進行需求分析,我覺得有必要先了解一下原型設計的步驟,進而在步驟中更好的進行優化與設計。

步驟一:了解需求,了解我們所做的産品是給誰做的,誰來開發,然後選擇合适的表達方式與工具。

步驟二:梳理頁面、頁面元素及頁面流程。可以通過思維導圖梳理該産品或者功能,頁面及頁面内的元素,大緻歸納出有幾個頁面,頁面内有幾個區域,區域内有什麼元素,采用什麼布局方式等;

步驟三:繪制原型初稿,按照頁面結構、資訊結構、業務流程開始繪制原型,确定每個頁面的布局和元素的位置,快速的繪制原型初稿。這個階段主要是把産品的流程走通

步驟四:深度校驗原型設計實作并添加标注。深度思考功能的必要性和優先級,盡可能把冗雜的元素删除或精簡,盡可能突出每個頁面的重要元素,重點辨別出異常邊界和文案提示,區分全局說明和局部說明,盡可能将标注寫的精簡、明确、全面。

一.從教師的角度分析

從需求分類來看,教師方面需要更加友善的對班級成員、教學内容及學生成績進行管理。 從這句話可以分析出,教師端需要實作班級成員管理、教學内容管理以及學生成績管理這三個功能。可以在教師的二級頁面處線先顯示學生的全體資訊,包括學号、成績以及個人資訊等,然後可以在此處進行添加、删除和更改等功能進而實作成績管理的功能。有關教學内容,粗略的制作的話可以總體的概括教學的大綱内容,盡量簡潔明了。細緻一點的話可以精确到每個學生的不同教學進度,以滿足"因材施教"的教學理念。

二.從助教的角度分析

從需求分類來看,助教方面需要更友善地對班級成員進行管理、與學生交流、對學生進行評價。同樣,根據這句話可以看出助教端和教師端的功能其實是有共同點的,就比如對班級成員進行管理這一功能的實作。而與之不同的就是,助教端需要實作與學生進行交流以及對學生進行評價的功能,可以借助墨刀裡面的互動界面來完成這一功能。

三.從學生的角度分析

從需求分類來看,學生方面需要更友善的互相交流,完成作業分析完教師與助教的功能實作之後,再來看學生端的實作就很簡單了。僅僅需要實作"交流"的功能,那麼墨刀中已經很友善的給我們提供了這一項功能,借助互動式界面的子產品,很輕松的就能實作這一功能。

四.整體分析

整體的需求角度來分析的話,需要考慮的内容就比較多了。不僅要設計到友善的使用班級部落格、離線狀态下的浏覽内容、更加簡潔美觀的适應性界面、完善的資訊提醒功能以及更加體系化的班級部落格内容和完善的分類以便于使用者找到自己需要的内容。首先,在整體原型設計實作的過程中,我覺得應該分次一步步的實作小分類的功能,然後在此基礎上進行一定的優化進而達到化整為零,部分之和大于整體的效果。再實作了三個小端口的功能後,通過标題級别分類的方式,讓整過頁面顯得更加階層化、體系化進而便于使用者查找到自己需要的内容。然後進行一些适配型的調試,使得整個頁面更加适用于其他端口的使用。

Part 3 原型設計的可檢視位址

學生端的連結:https://free.modao.cc/app/c180adc340f89f25a8f850050d0ffc6f42fe4125

助教端的連結:https://free.modao.cc/app/a2eb05aa589b986897157b15469fbf2ad6d18fcb

教師端的連結:https://free.modao.cc/app/9676971c3ffd60d550d84a256fd75b20ad14ba9b

Part 4 原型設計

1.學生端的實作

沿用墨刀中的一些基本模版再加以改動,學生端的界面很容易就可以制作出來,因為素材較多,是以繪制一個較為豐富的界面不是什麼大問題。但就是界面間的切換是個難點,通過上網搜尋相關資料等方式解決了界面切換的問題。下面是學生斷的最終實作界面圖檔

個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結
個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結

2.助教端的實作

以學生端為基礎進行一些界面跳轉的改變,将基本個人部落格的跳轉轉為學生資訊界面

個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結
個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結

3.教師端的實作

在上面兩個的基礎上,進行一些界面的簡單優化,然後将跳轉頁面轉化一下,更改為學生資訊包含學生姓名以及學号等。

個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結
個人第三次作業——原型設計Part 1 對比原型設計工具Part 2 需求分析Part 3 原型設計的可檢視位址Part 4 原型設計Part 5 總結

Part 5 總結

1.第一次使用原型設計工具,對很多操作方法不熟悉,例如如何将兩個頁面建立連結,如何插入自己想要的圖示圖案,如何設定精美的界面等。還需要多多使用并且多加練習,才能較好的掌握幾類基礎的原型設計工具。

2.原型設計的步驟不夠熟悉,從最開始的入手分析到最後的模型實作中的每一個步驟都需要在各方面加強練習,不光是深化步驟的了解,還要更好的優化界面設計的一系列功能操作。

3.學無止境,不懂就要多查閱資料,多在論壇上尋求幫助,要以一種渴望知識的态度去完成作業

轉載于:https://www.cnblogs.com/hz406945634/p/11601287.html

繼續閱讀