河南網(wǎng)站建設之手機網(wǎng)站的導航的原型及方法

　　近年來(lái)我國的經(jīng)濟發(fā)展并沒(méi)有之前發(fā)展的那么迅速了，究其原因就是我們慢慢全面加入世界貿易組織之后，我國的經(jīng)濟開(kāi)始和世界經(jīng)濟融為一體，當其他國家開(kāi)始遭受經(jīng)濟危機的危害之后，我國也受其影響，經(jīng)濟發(fā)展的速度慢慢降下來(lái)了 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。經(jīng)濟危機說(shuō)白了就是供過(guò)于求，找不到那么多客戶(hù)了，為了尋找更多的客戶(hù)，越來(lái)越多的人開(kāi)始把注意力轉移到互聯(lián)網(wǎng)市場(chǎng)上面來(lái)。但是要想在互聯(lián)網(wǎng)經(jīng)濟中有一席之地，那就必須有自己的網(wǎng)站。但是要想是自己的網(wǎng)站獨具一心，那就是在建站的時(shí)候能了解一些知識。今天河南網(wǎng)站建設公司——晟創(chuàng )聯(lián)自助建站平臺的網(wǎng)站建設專(zhuān)家們根據多年來(lái)網(wǎng)站建設的經(jīng)驗向大家介紹下網(wǎng)站建設的知識，這篇文章向大家介紹的是手機網(wǎng)站的導航的原型及方法。

　　手機網(wǎng)站的導航系統通常是最重要和復雜的用戶(hù)界面組件 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 近年來(lái),小屏幕,響應網(wǎng)站技術(shù)和不斷變化對硬件和軟件更增加了這種設計的復雜性。

　　一個(gè)快速 查詢(xún)的“移動(dòng)導航” 成千上萬(wàn)的意見(jiàn)返回導航模式,包括“漢堡包”菜單,前端插件,框架和大量的其他工具 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 盡管如此改變景觀(guān)的工具和設計趨勢,成功道路上的導航系統發(fā)送用戶(hù)的確切內容他們需要在正確的時(shí)間。

　　在本文中,我們將探討設計過(guò)程的開(kāi)始,以及技術(shù)特定移動(dòng)意念,和一個(gè)獨特的理念來(lái)構建一個(gè)原型導航系統主題(是的,主旨) AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。

　　建立一個(gè)基金會(huì )

　　一個(gè)設計師可能無(wú)法知道一個(gè)導航可以或應該是什么樣子不先了解誰(shuí)會(huì )用它,為什么 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 基金會(huì )的研究利用當定義一個(gè)網(wǎng)站的信息結構將幫助您做出更好的決策和利益相關(guān)者之間更快地獲得共識。

　　導航是一個(gè)網(wǎng)站的重要組成部分,設計不佳的時(shí)候,整個(gè)網(wǎng)站遭受 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 制作的過(guò)程一個(gè)運轉良好的導航系統,在許多形成因素,屏幕大小和類(lèi)型的用戶(hù)可能會(huì )看起來(lái)非常不同的從一個(gè)項目到下一個(gè)。 這是一個(gè)平衡,包括利益相關(guān)者的意見(jiàn),業(yè)務(wù)目標、技術(shù)限制、內容策略和用戶(hù)行為。 研究可以指導我們完成這一過(guò)程 通過(guò)幫助通知我們的優(yōu)先級(包括用戶(hù)和業(yè)務(wù)),我們的主要任務(wù)和目標,以及如何衡量成功。

　　從哪里開(kāi)始

　　最明顯的地方開(kāi)始當思考制定有效的導航屏幕大小是網(wǎng)站的內容 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 如果網(wǎng)站是足夠大或有很多遺留的內容,這可能意味著(zhù) 進(jìn)行審計 。 如果一個(gè)網(wǎng)站結構少,那么一般內容組織和觀(guān)眾的庫存可能足夠了。 審計、庫存或否則,忽視內容直到你到設計是有風(fēng)險的, 莎拉Wachter-Boettcher提醒我們 :

　　“你確定最終的問(wèn)題,就像一個(gè)導航系統,只有當你真正為兩個(gè)級別的工作內容有四個(gè)水平,以應對,讓所有的更深層次的信息只能很難管理(發(fā)現)文本鏈接——或者,更糟糕的是,除了通過(guò)搜索,使它完全無(wú)法訪(fǎng)問(wèn) AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。”

　　了解一個(gè)網(wǎng)站的內容并不一定意味著(zhù)知道每個(gè)句子,將每一頁(yè)上 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 一些內容可能不會(huì )存在,當你設計的導航。 沒(méi)關(guān)系。 考慮更高層次的問(wèn)題,如:

　　內容組織存在嗎?

　　他們的分類(lèi)是什么樣子的?

　　他們提供觀(guān)眾(s)做什么?

　　這些團體之間有何關(guān)系?

　　什么是他們的優(yōu)先級(從業(yè)務(wù)和用戶(hù)的角度)?

　　這些將直接形成用戶(hù)如何尋找你的網(wǎng)站 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 在小屏幕上,需要更高的優(yōu)先級,以確保房地產(chǎn)是最有效地使用。 了解的內容是一個(gè)謎——人們如何認識和使用內容是另一個(gè)。

　　跟人交談

　　從交談中獲得用戶(hù)的集體知識和利益相關(guān)者將通知不僅僅在小屏幕上導航 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 它將支付股息,在設計過(guò)程中發(fā)展。

　　與用戶(hù)和股東不必是一個(gè)正式的面試過(guò)程 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 坦誠的談話(huà)可能會(huì )產(chǎn)生更多的誠實(shí)和有用的結果。 專(zhuān)注于你所需要的每一個(gè)采訪(fǎng)中,試圖讓這個(gè)話(huà)題和壓力,他們有太多的問(wèn)題。

　　前進(jìn)行了一次采訪(fǎng),列出你想要的東西了 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 例如,讓你的主題談?wù)摰氖虑槟阈枰獮榱嗽O計更好的導航,你可以關(guān)注以下幾點(diǎn):

　　不同類(lèi)型的人將訪(fǎng)問(wèn)這個(gè)網(wǎng)站嗎?

　　他們期望不同的東西嗎?

　　他們來(lái)這里的目的是什么?

　　業(yè)務(wù)的重點(diǎn)是什么?

　　這與用戶(hù)之間的沖突嗎?

　　使用的設備如何影響期望?

　　當前導航的優(yōu)點(diǎn)和缺點(diǎn)是什么?

　　什么是進(jìn)入網(wǎng)站的登陸頁(yè)面或手段?

　　通過(guò)這些渠道用戶(hù)進(jìn)入網(wǎng)站嗎?

　　在用戶(hù)退出網(wǎng)站哪點(diǎn)呢?

　　其他網(wǎng)站完成類(lèi)似任務(wù)是什么?

　　是如何成功或不成功的?

　　主要研究與用戶(hù)和利益相關(guān)者提供個(gè)人觀(guān)點(diǎn)和可以給你內容的優(yōu)先級 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 如果你有訪(fǎng)問(wèn)網(wǎng)站的分析,他們可以添加深度訪(fǎng)談中發(fā)現的,反之亦然。 看看流行的登錄頁(yè)面,用戶(hù)導航流,反彈率和降低頁(yè)面的講述一個(gè)故事正在與導航的,什么是不——特別是在移動(dòng)設備上。

　　會(huì )變得混亂

　　草圖通常是第一步 在合成的見(jiàn)解研究實(shí)現設計 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 更重要的是,草圖提供了一種簡(jiǎn)便的格式盡快證明自己的想法,同行,利益相關(guān)者,有時(shí)甚至用戶(hù)。 就其本質(zhì)而言,素描缺乏細節,從而使他們的觀(guān)眾的對話(huà)如何可能出現的細節。

　　畫(huà)不同的解決方案可能會(huì )引發(fā)一場(chǎng)對話(huà),強調每種方法的優(yōu)點(diǎn)和缺點(diǎn),而進(jìn)一步定義要解決的問(wèn)題 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 草圖的目標之一是讓盡可能多的想法在紙上。 這個(gè)過(guò)程開(kāi)始,您可以創(chuàng )建一個(gè)框架,用于收集許多不同的方法來(lái)解決這個(gè)問(wèn)題,然后進(jìn)一步定義的細節。 在這樣一個(gè)框架,您將褶皺近照一張紙一半兩次,給你四個(gè)季度(大小幾乎完全為移動(dòng)),然后你會(huì )在每個(gè)象限素描一個(gè)獨特的導航方法。 頁(yè)面時(shí),你將開(kāi)始四種不同的方法來(lái)實(shí)現網(wǎng)站的導航。

　　在這一點(diǎn)上,你可能沒(méi)有足夠的細節來(lái)確定每個(gè)設計的優(yōu)點(diǎn)和缺點(diǎn),和更多的定義可能是必需的 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 進(jìn)一步探索每一個(gè)想法,把四張紙,把整個(gè)表來(lái)畫(huà)不同的州和每種方法的細節(例如,打開(kāi),關(guān)閉,選擇)。

　　( 查看大版本 )

　　素描時(shí),想想各種導航元素如何一起工作作為一個(gè)更大的系統的一部分,幫助用戶(hù)尋找的網(wǎng)站 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 的網(wǎng)站內容結構,包括許多不同的頁(yè)面的水平,可能需要多個(gè)way-finding組件。 尤其是在小屏幕上,傳播一些導航的責任在這些組件是有效的。 例如,這些元素可能包括多層次的組合主要導航、上下文區域級導航和互動(dòng)的面包屑。 在這種情況下,用戶(hù)可能不需要看到每個(gè)導航組件在同一時(shí)間在每一頁(yè)上。

　　這個(gè)工作由各級草圖頁(yè)面在網(wǎng)站的架構是一個(gè) 開(kāi)始決策和設定預期的好方法 與同事和利益相關(guān)者 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 考慮什么類(lèi)型的每個(gè)頁(yè)面上應該顯示導航元素水平,這些元素如何互相影響。

　　顯示在正確的時(shí)間正確的數量的導航需要很多的思考和規劃 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 作為思想討論和共識周?chē)纬梢粋€(gè)示意圖,它可能需要開(kāi)發(fā)這些想法變成一個(gè)工件,更接近實(shí)際的設計。 雖然草圖文檔高級思維,闡明組件(如運動(dòng)設計、交互設計和內容可以詳細至關(guān)重要,將決定你如何實(shí)際執行導航系統。

　　獲得真正的

　　一個(gè)可以創(chuàng )建一個(gè)健壯的用戶(hù)體驗原型今天在很多方面 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 您可以使用一個(gè)基于web的應用程序像InVision或構建頁(yè)面的HTML和CSS,或者創(chuàng )建一個(gè)紙上原型,等等。 這些方法都有不同的優(yōu)點(diǎn)和缺點(diǎn),每個(gè)適合一個(gè)特定的團隊的設計過(guò)程不同程度的成功。

　　最成功的工件溝通的細節在正確的時(shí)間在一個(gè)項目 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 最有效的設計師更少關(guān)注所使用的工具,更需要在某個(gè)時(shí)間點(diǎn)上進(jìn)行交流。 去年在談話(huà) ,設計師克里斯Cashdollar敦促設計師創(chuàng )建的工件”找到的最高金額同意用最少的時(shí)間,”稱(chēng)之為“最小工件有效。”

　　創(chuàng )建有效的工件可能意味著(zhù)跳躍到代碼對一些人來(lái)說(shuō),或使用另一種媒體進(jìn)一步定義和測試設計的細節 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 下一步很大程度上取決于團隊的規模和技術(shù)負責,這個(gè)工件的目標受眾,項目的時(shí)間表。 進(jìn)一步描述設計的目的可能不需要學(xué)習一種新工具或技能。 一些最基本的方法已經(jīng)是團隊的工具包的一部分,可以創(chuàng )造性地適應這一目的。

　　使用你所知道的

　　我并不熱衷于使用“非設計工具的想法像主題創(chuàng )建一個(gè)動(dòng)畫(huà)原型 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 出售我的團隊,我們的項目有一個(gè)非常緊密的周轉時(shí)間,數量有限的人,需要一定程度的動(dòng)畫(huà)的忠誠。 雖然主題不是專(zhuān)門(mén)為工具設計接口, 作為 別人 有 指出 出 我可以作證后嘗試了自己,它工作得非常好。

　　我們看了其他受歡迎的工具,包括 InVision , 籌劃者 和蘋(píng)果的石英作曲家 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 然而,時(shí)間約束的結合、成本、忠誠和靈活性使這個(gè)項目適合主題。 我們發(fā)現預先投入的時(shí)間學(xué)習這個(gè)工具非常少,因為主題學(xué)習曲線(xiàn)低,幾乎所有的團隊成員可以快速了解如何使用它。 此外,我的團隊沒(méi)有成本使用這個(gè)軟件,因為主題是免費在Mac OS X 10.8(小牛)和更高。

　　主題限制其文檔帆布面積相對較小,所以它不適合設計大型或長(cháng)頁(yè)面 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 它的價(jià)值在于描述特定的UI組件的交互和運動(dòng)設計。 這個(gè)尺寸約束并適合模擬移動(dòng)導航模式,它甚至可以用于定義一些審美元素。

　　你需要了解一些基本的軟件以開(kāi)始使用UI設計的主旨:

　　使用基本形狀、文本和顏色;

　　導入其他類(lèi)型的媒體(矢量圖形,png,jpg,等等);

　　分層的形狀;

　　使用“魔法”過(guò)渡到幻燈片之間的動(dòng)畫(huà);

　　動(dòng)畫(huà)組件在一個(gè)幻燈片 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。

　　當開(kāi)始移動(dòng)的設計主題,設置文檔大小的一個(gè)現實(shí)的視窗 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 這將有助于隱藏諸如off-canvas導航,頁(yè)面的部分以外的當前視圖(即要求滾動(dòng)看到部分)和任何UI的無(wú)形狀態(tài),需要顯示為工件的一部分。 生成這個(gè)視窗,開(kāi)始一個(gè)新的空白主題演講。 在第一張幻燈片中,創(chuàng )建四個(gè)矩形的兩邊各有一個(gè)幻燈片,留下一個(gè)空的空間在中間。

　　( 查看大版本 )

　　這些矩形不會(huì )隨時(shí)編輯后,所以鎖定將確保他們不會(huì )意外地選擇或移動(dòng) AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。

　　接下來(lái),我們就可以開(kāi)始修整默認狀態(tài)的主要導航,使用形狀、文本和其他資產(chǎn)來(lái)表示這個(gè)UI AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 決定在草圖后,我們的研究發(fā)現,網(wǎng)站的信息架構,我們可以在主題創(chuàng )建此導航的開(kāi)端。 導航一直嘲笑后,選擇所有的元素,然后點(diǎn)擊“發(fā)送”選項,將導航欄的畫(huà)布背后的黑色矩形。

　　下一步是想想這個(gè)導航的其他州會(huì )在一起形成一個(gè)系統 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 在上面的示例中,當有人龍頭的“更多”項目? 我們可以模擬由復制原始幻燈片和創(chuàng )建這個(gè)新國家。 在本例中,我們將主要導航到左邊,揭露“更多”項目。 移動(dòng)導航欄后面我們最初創(chuàng )建的矩形框架窗口。 我們也可以創(chuàng )建一個(gè)新的面板顯示附加的導航元素。

　　( 查看大版本 )

　　現在我們有兩個(gè)幻燈片演示,每個(gè)代表一個(gè)不同的導航狀態(tài) AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 精確描述如何從第一個(gè)默認狀態(tài)到打開(kāi)狀態(tài),我們可以使用一個(gè)主題轉變被稱(chēng)為“魔動(dòng)。 “魔將自動(dòng)生成動(dòng)畫(huà)需要向不同位置形狀在一個(gè)幻燈片在接下來(lái)的幻燈片(類(lèi)似于Flash漸變)。 注意到我們的第二個(gè)幻燈片有新元素(我們創(chuàng )建的附加的導航面板),魔法不知道如何對待他們,所以它在默認情況下會(huì )褪色。 因為我們希望這個(gè)面板下滑,我們需要復制并粘貼到第一張幻燈片,把它放在原來(lái)的位置超出了視窗(背后的黑色矩形)。

　　( 查看大版本 )

　　我們現在可以讓魔術(shù)將做它的魔力通過(guò)選擇第一張幻燈片和檢查員去“動(dòng)畫(huà)”選項卡中,單擊“添加一個(gè)效果 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 “一旦創(chuàng )建了過(guò)渡,我們可以使用“預覽”功能和調整時(shí)間代表多快或慢這個(gè)面板應該下滑。

　　成功! 現在這個(gè)菜單幻燈片打開(kāi)動(dòng)畫(huà) AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 讓我們添加反向動(dòng)畫(huà),使其滑動(dòng)關(guān)閉。 要做到這一點(diǎn),我們只是重復第一張幻燈片,幻燈片3號訂單。 然后,我們添加相同的魔法將過(guò)渡到第二個(gè)幻燈片,這將創(chuàng )建的動(dòng)畫(huà)菜單滑動(dòng)回到默認位置。 最后,它將看起來(lái)是這樣的:

　　從這里開(kāi)始,我們可以使用類(lèi)似的技術(shù)來(lái)構建其他州的導航——即擴大州“產(chǎn)品”和“職業(yè)生涯 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 “在產(chǎn)品部分,讓我們想象多頁(yè)面級別:一個(gè)用于一個(gè)類(lèi)別的產(chǎn)品和一個(gè)子類(lèi)。 我們可以繼續使用魔法過(guò)渡到顯示用戶(hù)如何與這些項目。 首先,我們可以顯示父類(lèi):

　　神奇的一件事是它不僅適用于移動(dòng)定位元素,而且對顏色變化,透明度和旋轉 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 例如,在上面的截圖中,我將“產(chǎn)品”文本的顏色從藍色到白色。 這種轉變的魔法移動(dòng)處理相同的方式處理的定位導航欄。 在擴大的菜單,我們可以看到加號旋轉成一個(gè)“X”,允許用戶(hù)關(guān)閉分組。 把整個(gè)過(guò)渡,我們現在有這個(gè):

　　結束

　　復雜的導航是最成功的內容時(shí),IA、用戶(hù)研究和討論利益相關(guān)者驅動(dòng)設計 AI從窗口頁(yè)面當中如何快速查看文檔尺寸大??？。 而導航系統可能不會(huì )看起來(lái)一樣在所有設備,提供路徑相同的內容是至關(guān)重要的。 思考小屏幕在設計過(guò)程的早期,然后草圖和創(chuàng )造設計工件在不同形式允許更多的討論和更好的決策。