手機(jī)表單設(shè)計(jì)（手機(jī)表格設(shè)計(jì)軟件）

本文目錄一覽：

• 1、表單設(shè)置可以在手機(jī)端操作嗎？

• 2、表單設(shè)計(jì)2：表單的基本要素

• 3、[交互設(shè)計(jì)]PC移動(dòng)端表單設(shè)計(jì)

• 4、如何在手機(jī)上做表格的效果

• 5、釘釘如何表單設(shè)計(jì)？

• 6、北大青鳥設(shè)計(jì)培訓(xùn)：提高用戶體驗(yàn)的八種表單設(shè)計(jì)技巧？

表單設(shè)置可以在手機(jī)端操作嗎？

您好，目前支持管理員在手機(jī)端設(shè)置表單哦，可操作的內(nèi)容有：查看假勤類套件明細(xì)、修改名稱圖標(biāo)、添加/刪除/修改控件名稱以及內(nèi)容。操作路徑為：管理員打開手機(jī)釘釘-【工作】-【審批】-點(diǎn)擊進(jìn)對應(yīng)的審批單-右上角【編輯】，如下圖：點(diǎn)擊進(jìn)編輯后即可對表單進(jìn)行編輯操作，如下圖所示：【溫馨提示】：1、審批意見、代提交、手寫簽名可以點(diǎn)擊【高級(jí)設(shè)置】進(jìn)行編輯設(shè)置；2、也可在手機(jī)端編輯表單的頁面來設(shè)置審批流程；3、出勤套件、人事套件目前暫不支持在手機(jī)端進(jìn)行刪除、添加、修改，只支持排序；4、關(guān)聯(lián)審批單和計(jì)算公式這兩個(gè)目前還暫不支持在手機(jī)端進(jìn)行配置。

表單設(shè)計(jì)2：表單的基本要素

上一篇文章我們講到了表單設(shè)計(jì)的基本原則，這一篇我們來了解表單的基本要素。我們知道每個(gè)表單至少都有三個(gè)基本要素：標(biāo)簽、輸入框和動(dòng)作。標(biāo)簽用來提出問題，輸入框用來填寫答案，動(dòng)作則用來提交答案。每一個(gè)要素的設(shè)計(jì)好壞都會(huì)對表單產(chǎn)生影響。下面我們詳細(xì)說明：

標(biāo)簽應(yīng)當(dāng)采用簡潔易懂的語言來提出問題，以便于回答。那在布局上標(biāo)簽是左對齊，右對齊，還是頂對齊？— —答案是根據(jù)需求而定。

這并不是一句廢話，之前的文章中提過，脫離了業(yè)務(wù)需求和用戶需求的設(shè)計(jì)是沒有意義的，需求不同對表單的設(shè)計(jì)要求也不一樣。比如：有的表單希望用戶在最短時(shí)間內(nèi)填完，而有的表單希望降低用戶的填寫速度，以此來讓用戶對每一個(gè)問題都能夠深思熟慮的作答。

下面我們來看看標(biāo)簽的不同對齊方式都有哪些優(yōu)缺點(diǎn)及其適用場景。

下圖是網(wǎng)易云課堂申請開課的表單，其標(biāo)簽為左對齊標(biāo)簽

左對齊標(biāo)簽的優(yōu)點(diǎn)：

（1）容易瀏覽

標(biāo)簽左對齊更方便用戶瀏覽，用戶只需要上下閱讀標(biāo)簽便可快速瀏覽表單，而不會(huì)被輸入框打斷；

（2）占用的垂直空間較少

由于標(biāo)簽與輸入框在同一行，在頁面中占用的垂直空間相對更少；

左對齊標(biāo)簽的缺點(diǎn)：

填寫速度最慢

左對齊標(biāo)簽與輸入框之間的間距由最長的標(biāo)簽決定，這就導(dǎo)致部分較短的標(biāo)簽和輸入框之間的距離較大，用戶將標(biāo)簽和對應(yīng)輸入框聯(lián)系起來的時(shí)間也就稍微長一些。

左對齊標(biāo)簽的適用場景：

雖然左對齊標(biāo)簽是3種方式中填寫速度最慢的，但完成時(shí)間長并不一定是壞事。如果你希望用戶仔細(xì)考慮表單中每個(gè)問題和答案時(shí)，左對齊標(biāo)簽是個(gè)好辦法。

而當(dāng)你選擇采用左對齊標(biāo)簽時(shí)，你可以讓標(biāo)簽長度盡量保持一致，來避免瀏覽不方便這一問題。

另外，如果表單中既有必填項(xiàng)也有選填項(xiàng)，而你想讓用戶能夠很方便的整體瀏覽表單問題時(shí)，也可以采用左對齊標(biāo)簽。

下圖是騰訊課堂申請開課的表單，標(biāo)簽采用了右對齊的方式。

右對齊標(biāo)簽優(yōu)點(diǎn)：

（1）輸入框與標(biāo)簽相鄰

標(biāo)簽與輸入框相鄰，使用戶能很好的將二者聯(lián)系在一起，從而更快速的回答問題。采用標(biāo)簽右對齊方式設(shè)計(jì)的表單其完成速度是3種方式中居中的一個(gè)。

（2）占用的垂直空間較少

由于標(biāo)簽與輸入框在同一行，在頁面中占用的垂直空間相對更少；

右對齊標(biāo)簽缺點(diǎn)：

表單的可讀性降低

由于大部分人的瀏覽習(xí)慣是從左到右，所以左側(cè)不齊的話，用戶的視線需要來回移動(dòng)，降低了整體表單的瀏覽效率。如果標(biāo)簽文字折行的話，效率會(huì)更低。

（這里需要注意，整體瀏覽效率與表單完成率不是一個(gè)概念，整體瀏覽效率可以理解為表單的可讀性，表單完成率可以理解為完成表單所需的時(shí)間）。

右對齊標(biāo)簽的適用場景：

如果希望用戶快速完成表單填寫，且占用更少的垂直距離時(shí)，可以采用右對齊標(biāo)簽，但是要注意，不要讓標(biāo)簽文字折行而影響表單可讀性。

下圖是藍(lán)湖網(wǎng)站意見反饋頁面，是一種頂對齊標(biāo)簽方式的表單。

頂對齊標(biāo)簽的優(yōu)點(diǎn)：

（1）完成表單所需時(shí)間最短

頂對齊標(biāo)簽與輸入框之間的位置緊密相鄰，使表單填寫變得很快，而且用戶的瀏覽順序是一直向下的，使得表單有清晰的完成路徑。

（2）橫向空間可延伸

由于標(biāo)簽和輸入框是垂直排列的，這樣在橫向上就有充足的空間，標(biāo)簽文字也可以有更大的擴(kuò)展性。

頂對齊標(biāo)簽的缺點(diǎn)：

占用較大的垂直空間

相對于前2種方式，頂對齊標(biāo)簽會(huì)占用額外的垂直空間。

如果你選用了頂對齊標(biāo)簽的設(shè)計(jì)方式，那么要注意采用合適的垂直間距，最好使用輸入框50%-75%的高度作為相鄰輸入框的間距。

頂對齊標(biāo)簽的適用場景：

如果希望用戶最快速的完成表單，或者表單的標(biāo)簽很長（如英文標(biāo)簽），希望在橫向上有更大的擴(kuò)展性且垂直方向不受限制時(shí)，可以采用頂對齊標(biāo)簽。

標(biāo)簽的布局除上述三種外，還有輸入框內(nèi)標(biāo)簽和混合對齊標(biāo)簽。

輸入框內(nèi)標(biāo)簽適用于表單非常短，或屏幕空間極度有限的情況。如下圖是新浪微博未登錄時(shí)的首頁，其中登錄注冊表單只占了很小的部分，所以采用了輸入框內(nèi)標(biāo)簽的方式。

如果你選擇使用輸入框內(nèi)標(biāo)簽，需要注意以下幾點(diǎn)：

（1）當(dāng)焦點(diǎn)定位在輸入框時(shí)，標(biāo)簽不要立即消失，而要保證用戶能夠看到問題（標(biāo)簽內(nèi)容）；

（2）當(dāng)用戶輸入時(shí)，標(biāo)簽應(yīng)該消失，而不要成為答案的一部分；

（3）輸入框內(nèi)標(biāo)簽更適合只有一個(gè)輸入框（比如搜索）或者用戶對幾個(gè)輸入框的問題非常熟悉的表單（比如登錄注冊）；

（4）如果表單較長，不建議使用輸入框內(nèi)標(biāo)簽。因?yàn)橛脩魰?huì)忘記要回答的是什么問題，而且填寫完表單再檢查時(shí)也會(huì)因?yàn)榭床灰妴栴}而無法核對；

還有一種布局是混合對齊標(biāo)簽，我們是不建議使用的。因?yàn)榛旌蠈R的方式瀏覽起來很不方便，也會(huì)破壞用戶完成表單的明確路徑。

常見的輸入框類型有以下幾種：

文本框： 允許用戶輸入任意數(shù)量（或限定數(shù)量）的字符；

單選框： 允許用戶從2個(gè)或多個(gè)選項(xiàng)中選擇一個(gè)，由于選項(xiàng)之間互斥，因此建議有默認(rèn)選項(xiàng)。當(dāng)選項(xiàng)不多或希望將選項(xiàng)全部展示出來時(shí)，建議使用單選框；

使用時(shí)應(yīng)當(dāng)保證點(diǎn)擊單選框或者標(biāo)簽都能選中。

復(fù)選框： 允許用戶選擇一個(gè)或多個(gè)，或用于選擇“是”或“否”的問題。

使用時(shí)應(yīng)當(dāng)保證點(diǎn)擊復(fù)選框或者標(biāo)簽都能選中；

下拉菜單： 允許用戶從2個(gè)或多個(gè)選項(xiàng)中選擇一個(gè)。適用于選項(xiàng)較多時(shí)使用，但是要注意控制選項(xiàng)數(shù)量。

輸入框不只被用來填寫答案，其長度對用戶填寫答案還能起到暗示作用。

如下圖所示：“手機(jī)號(hào)碼”、“輸入短信驗(yàn)證碼”和“簡介三個(gè)標(biāo)簽對應(yīng)的輸入框長度是不一樣的，因?yàn)樗鼈儗Υ鸢傅拈L度要求不同。

所以輸入框的長度對人們填寫答案時(shí)起到了有效的暗示，我們在設(shè)計(jì)時(shí)，如果答案有固定的規(guī)則（如郵編、電話號(hào)碼、短信驗(yàn)證碼、郵箱，備注、簡介等），可通過長短不同的輸入框來暗示用戶。

如果答案沒有規(guī)則無法暗示，則輸入框應(yīng)保持長度一致，足夠填寫答案即可，避免長度不一導(dǎo)致用戶混亂。

動(dòng)作是完成表單的關(guān)鍵一步，因?yàn)槲覀兲顚懲瓯韱沃笠疤峤弧薄Ｎ覀兛梢园岩恍┲匾男袨橐暈椤爸鲃?dòng)作”，如：提交、保存、下一步等。另一些與完成表單填寫的目標(biāo)相悖的行為可以視為“次動(dòng)作”，如：取消、撤銷、返回等。

還有一些在表單填寫過程中的動(dòng)作可以視為“進(jìn)程中動(dòng)作”，如：查詢、上傳附件等。

在動(dòng)作設(shè)計(jì)時(shí)，需要注意以下幾點(diǎn)：

表單中動(dòng)作的數(shù)量不宜過多，不然會(huì)讓用戶無從選擇。如果表單中既有主動(dòng)作又有次動(dòng)作，那么應(yīng)該從視覺上區(qū)分。

表單設(shè)計(jì)應(yīng)當(dāng)為用戶提供明確的完成路徑，減少填表所花費(fèi)的時(shí)間，上文的可用性測試實(shí)驗(yàn)也驗(yàn)證了主動(dòng)作與輸入框?qū)R是表單完成最快的方案。

這里需要說明，由于PC端屏幕可視區(qū)域較大，因此信息的展示方式是重要考慮的因素，應(yīng)該便于用戶瀏覽，方便用戶在復(fù)雜的信息中快速找到需要的信息并完成操作。而在手機(jī)端，我們發(fā)現(xiàn)大部分主動(dòng)作放在了右側(cè)，是因?yàn)槭謾C(jī)端屏幕有限，信息已經(jīng)是極度精簡后的內(nèi)容，此時(shí)在有限的空間內(nèi)方便操作則變得更加重要。

進(jìn)程中的動(dòng)作應(yīng)該讓進(jìn)程可視化。當(dāng)后臺(tái)正在處理用戶的某一“動(dòng)作”時(shí)，用戶是看不到的，所以我們最好能給予用戶反饋，告知用戶我們接到了指令并且動(dòng)作正在進(jìn)行，這樣能夠減少用戶的焦慮，也可避免表單重復(fù)提交。

下圖是郵箱上傳附件的截圖：

用戶選擇附件后能夠看到當(dāng)前上傳的進(jìn)程，這樣既給了用戶成功反饋，又能減少用戶等待時(shí)的焦慮。

還有一種方式是把進(jìn)程直接放在按鈕上顯示。如下圖，正在登錄和獲取驗(yàn)證碼按鈕，用戶點(diǎn)擊按鈕后有一個(gè)后臺(tái)處理信息的過程可視化。將進(jìn)程放在按鈕上能夠給予用戶最輕量的提示，同時(shí)不會(huì)占用多余的空間。

關(guān)于動(dòng)作按鈕，還有一種常見的方式是禁用主動(dòng)作，就是將主動(dòng)作按鈕置灰不可點(diǎn)擊，只有當(dāng)用戶完成表單后才可點(diǎn)擊。這時(shí)需要注意，后臺(tái)要對每個(gè)問題的答案進(jìn)行校驗(yàn)且要知道什么時(shí)候用戶回答完所有問題。

關(guān)于表單的基本要素就寫到這里。都是我在工作中的積累和總結(jié)。其實(shí)，表單設(shè)計(jì)還有很多細(xì)節(jié)，且不同的場景和目標(biāo)對表單的要求也各不相同，我們要不斷的積累，尋求更好的解決方案，做出更符合產(chǎn)品和用戶需求的設(shè)計(jì)。

[交互設(shè)計(jì)]PC移動(dòng)端表單設(shè)計(jì)

手機(jī)App為生活帶來巨大便利，多種多樣的移動(dòng)表單設(shè)計(jì)形式進(jìn)入我們的工作與生活。表單是移動(dòng)應(yīng)用中與用戶產(chǎn)生最多交互的地方，包括：用戶注冊、訂閱服務(wù)、用戶反饋、問卷表單、買賣交易等等。

一個(gè)優(yōu)秀的表單設(shè)計(jì)有助于提升產(chǎn)品用戶體驗(yàn)，提高轉(zhuǎn)化率，達(dá)到更好的營銷效果。

每個(gè)表單都有特定的目的，或吸引注冊，或達(dá)成交易。考慮不周或錯(cuò)誤設(shè)計(jì)會(huì)導(dǎo)致用戶流失或交易失敗。

學(xué)習(xí)表單設(shè)設(shè)計(jì)，需要先了解表單設(shè)計(jì)的基本原則，避免做表單時(shí)進(jìn)入雷區(qū)。

表單設(shè)計(jì)基本原則

1. 邏輯清晰

表單是產(chǎn)品與用戶溝通的語言，和對話一樣，表單應(yīng)當(dāng)符合邏輯，幫助雙方完成交流。

  2. 盡量使用單列設(shè)計(jì)

多列表單容易讓用戶漏填，無法集中精力完成填寫。單列表單填寫路徑單一、直接、相比更為高效。 

3. 減少輸入

表單越長越復(fù)雜，用戶完成表單的意愿越低（尤其在移動(dòng)端產(chǎn)品中）。最大限度減少輸入字段，使表單完成更快速，尤其向用戶索取大量信息時(shí)，更要注意表單簡潔。

4. 提供合適的輸入方式

輸入“賬號(hào)、密碼，郵箱，昵稱”時(shí)應(yīng)提供不同鍵盤，減少輸入錯(cuò)誤，幫助用戶快速完成填寫。 

5. 避免把標(biāo)簽當(dāng)占位符使用

有一種設(shè)計(jì)模式是讓標(biāo)簽作為占位符置于輸入框中，用戶點(diǎn)擊輸入時(shí)自動(dòng)消失。這種設(shè)計(jì)比較簡約，但用戶輸入時(shí)容易忘記需要輸入的字段是什么，從而產(chǎn)生問題。

優(yōu)秀案例：移動(dòng)端表單設(shè)計(jì) 

↘Dropbox by Sam Atmore

交互設(shè)計(jì)分析 ：

Sam的登陸/注冊表單中，登陸、注冊邏輯非常清晰。

1.使用單列二選一表單設(shè)計(jì)。用戶使用App前，只需要二選一隨標(biāo)簽提示進(jìn)行下一步操作。就是誤操作也可以用滑動(dòng)回到另一選項(xiàng)。

2.登陸、注冊頁面的主按鈕明確，有強(qiáng)引導(dǎo)作用。 

↘Location Switching - by Nimasha Perera

交互設(shè)計(jì)分析：關(guān)鍵詞“智能自動(dòng)填充選項(xiàng)”

表單設(shè)計(jì)融入更多自動(dòng)化元素。如：自動(dòng)定位功能，根據(jù)當(dāng)前位置智能填充信息。省去用戶地理位置選擇操作，貨幣轉(zhuǎn)化操作，省時(shí)省力

↘Form Validation - by Emmanuel Torres

交互設(shè)計(jì)分析 ：關(guān)鍵詞“明顯可見的提示信息”

用戶登陸、注冊過程，理想狀態(tài)是完成信息填寫并提交。

但實(shí)際操作中錯(cuò)誤不可避免，表單設(shè)計(jì)要考慮有辨識(shí)度的信息提示，實(shí)時(shí)提醒用戶填寫錯(cuò)誤。而不是全部完成后再告訴他。

拆解表單組件樣式

表單的主要特點(diǎn)是引導(dǎo)用戶填寫信息，設(shè)計(jì)上應(yīng)考慮主要信息內(nèi)容如何引導(dǎo)用戶瀏覽。表單中的信息內(nèi)容包括：

1) 輸入字段： 包括文本字段、密碼字段、復(fù)選框、單選按鈕、滑塊和其他需要用戶輸入的字段；

2) 字段標(biāo)簽： 說明用戶輸入字段的含義，如文本框前的“你的姓名”；

3) 外觀和結(jié)構(gòu)： 包括字段順序、表單在界面中的樣式及不同字段間邏輯關(guān)系；

4) 動(dòng)作按鈕： 至少有一個(gè)操作按鈕（如提交按鈕）；

5) 反饋信息： 將操作結(jié)果通知用戶。如：“謝謝，表單提交成功！”、“你提供的數(shù)字不正確”。

l主流表單樣式

↘上標(biāo)題下提示內(nèi)容的表單

優(yōu)點(diǎn)：標(biāo)題、提示內(nèi)容可以很長，預(yù)覽速度快，可以加功能按鈕（如附件和照片添加）。

缺點(diǎn)：占據(jù)垂直空間較大。

多用于信息內(nèi)容填寫和維修工單信息填寫，可以減少頁面跳轉(zhuǎn)。

↘左標(biāo)題右內(nèi)容（左右對齊）

優(yōu)點(diǎn)：常用組件，前端可以直接套用，節(jié)省垂直空間，引導(dǎo)用戶視覺左右移動(dòng)，增加用戶思考時(shí)間，對關(guān)鍵信息填寫更加安全。

缺點(diǎn)：相比上下結(jié)構(gòu)表單，用戶視覺移動(dòng)距離增加,行數(shù)量多，視覺會(huì)很亂。

適用于通用表單填寫場景。

↘左標(biāo)題右內(nèi)容（全部居左對齊）

優(yōu)點(diǎn)：強(qiáng)暗示可輸入，視覺瀏覽速度快。

缺點(diǎn)：標(biāo)題字段數(shù)量不能太過長短不一，會(huì)導(dǎo)致視覺不均衡。

主要適用場景：適合金額數(shù)字類和身份信息填寫。

↘歸類標(biāo)題表單（內(nèi)容歸屬一類）

將同類表單項(xiàng)合成小組內(nèi)容，幫助用戶分類理解填寫內(nèi)容。符合格式塔原理的相似性和封閉性原理。

多用于詳情信息展示。

↘僅提示內(nèi)容表單

優(yōu)點(diǎn)：信息少，不需要思考。

缺點(diǎn)：當(dāng)內(nèi)容一多很容易出現(xiàn)用戶“不知道產(chǎn)品要做什么”的困惑（表單無標(biāo)題）。

用于登錄頁或內(nèi)容較少，如修改手機(jī)號(hào)/修改姓名/填寫備注等。

拆解表單組件交互

表單交互主要有兩個(gè)目標(biāo)：引導(dǎo)操作和反饋。

交互操作時(shí)，表單有3個(gè)交互階段：輸入前、輸入中、輸入后

↘輸入前

引導(dǎo)用戶輸入內(nèi)容，如：密碼設(shè)置場景

輸入框在默認(rèn)狀態(tài)提示文案引導(dǎo)用戶輸入相應(yīng)的內(nèi)容；或輸入框外有提示，僅支持字母、數(shù)字、某某符號(hào)輸入

↘輸入中

點(diǎn)擊輸入框彈出鍵盤，光標(biāo)閃爍，定位用戶當(dāng)前位置。

表單內(nèi)容一般有字符數(shù)量限制，輸入過程中超過字符限制實(shí)時(shí)報(bào)錯(cuò)提示。

如下圖：聚焦請輸入原密碼時(shí),線段顏色明顯加重，做為輸入中提示。

↘輸入后

web端

輸入框失焦即判斷輸入信息是否符合規(guī)則，不合規(guī)則報(bào)錯(cuò)提示。例如：

玩家用戶名重復(fù)提醒，密碼首字母沒有大寫，密碼長度不符合要求；

輸入成功則成功反饋，例如：

輸入框右側(cè)圖標(biāo)點(diǎn)亮

移動(dòng)端

輸入所有內(nèi)容，不即刻做規(guī)則判斷，先激活按鈕。例如：

發(fā)布、完成、下一步按鈕激活

用戶點(diǎn)擊操作按鈕再進(jìn)行輸入信息合規(guī)判斷。

案例：提升用戶體驗(yàn)和客戶轉(zhuǎn)化的最佳表單設(shè)計(jì)

填寫表單對于用戶來說是一道檻，下面就來看一看提升用戶體驗(yàn)和客戶轉(zhuǎn)化的注冊、登錄表單中最佳設(shè)計(jì)模式時(shí)應(yīng)注意哪些設(shè)計(jì)、交互細(xì)節(jié)：

1.說明注冊價(jià)值

用戶最不想做的事就是注冊。用明確的價(jià)值說明能激發(fā)注冊行為。表達(dá)的價(jià)值主張：在這里，連接世界。

2.設(shè)置醒目登陸輸入框

直接顯示輸入框，而不是設(shè)置“登錄”鏈接給用戶增加一次點(diǎn)擊。

3.允許使用第三方賬號(hào)注冊、登錄

允許用戶使用現(xiàn)有的第三方帳戶登錄產(chǎn)品能給用戶帶來便利，記很多密碼是令人頭痛的問題。

4.用戶名采用郵箱或手機(jī)號(hào)碼

使用電子郵件、手機(jī)號(hào)碼作為用戶名比起一個(gè)新名字讓用戶輕松很多，因?yàn)樾缕鸬挠脩裘驯徽加谩?/p>

5.登錄、注冊功能區(qū)分明顯

登錄（Sign in/Login）、注冊（Register/Sign up）鏈接放在一起，很容易使用戶混淆，盡可能將兩者區(qū)別表達(dá)

6.高亮顯示輸入框，允許記住用戶登錄信息

用戶在輸入框輸入內(nèi)容時(shí)，文本框高亮顯示提示正在該框內(nèi)工作。允許該表單記住本人登錄信息。

7.允許用戶查看密碼

密碼總是以圓點(diǎn)顯示，不能確認(rèn)輸入的密碼是否正確，允許密碼明文顯示是充滿人性的設(shè)計(jì)。

8.必要的信息提示

輸入錯(cuò)誤的信息提示，還包括一些重要的注意事項(xiàng)提示，例如以下三個(gè)表單：

9.顯示密碼強(qiáng)壯程度

10.少使用下拉選項(xiàng)

表單中某項(xiàng)目里只有3-4個(gè)參數(shù)要選擇，不要使用下拉框更有利于用戶體驗(yàn)。不要要求用戶重復(fù)填寫Email地址。

如何在手機(jī)上做表格的效果

對于經(jīng)常出差的員工來說，用電腦制作表格是很不方便的。這就需要掌握在手機(jī)上制作表格的方法，能夠在移動(dòng)端隨時(shí)隨地在移動(dòng)端創(chuàng)建、查看、共享和查看表單，以實(shí)現(xiàn)協(xié)作工作。下面就通過手機(jī)報(bào)表工具，來介紹手機(jī)怎么做表格。

1、app啟動(dòng)背景、表格封面

手機(jī)移動(dòng)端的表單啟動(dòng)畫面和報(bào)表封面，可以選擇默認(rèn)內(nèi)置圖片，也可以自定義上傳圖片。

上傳圖片要注意尺寸問題，要考慮與大多數(shù)手機(jī)一樣的分辨率，才能達(dá)到最好的效果。

2、服務(wù)器配置

二維碼配置是指，輸入服務(wù)器名稱和地址，即可生成二維碼，手機(jī)報(bào)表軟件掃描二維碼，添加相應(yīng)的服務(wù)器按鈕，就可以在該服務(wù)器里制作報(bào)表了。

二維碼配置是指，輸入服務(wù)器名稱和地址即可生成二維碼，手機(jī)報(bào)表軟件掃描二維碼，添加相應(yīng)的服務(wù)器按鈕，就可以在該服務(wù)器里制作報(bào)表了。

3、表格主體

制作手機(jī)表格主體部分的數(shù)據(jù)、屬性等，就是正常的點(diǎn)擊-編輯-輸入。

高級(jí)的手機(jī)表格軟件，如FineReport，同樣的模板，在PC和手機(jī)上都是自適應(yīng)的，不需要反復(fù)調(diào)整。除了支持手機(jī)報(bào)表制作、顯示外，還支持?jǐn)?shù)十種圖表類型，以及參數(shù)查詢和數(shù)據(jù)過濾;支持填充數(shù)據(jù)。手機(jī)上有很多方便的手勢，比如手勢縮放。

4、導(dǎo)出格式

在手機(jī)表格軟件中，可以自定義導(dǎo)出報(bào)表格式。

5、權(quán)限管理

對于企業(yè)用戶，有報(bào)表軟件提供了移動(dòng)設(shè)備綁定功能，以確保數(shù)據(jù)安全性。如果管理員沒有授權(quán)該設(shè)備，則無法登錄。而且，移動(dòng)終端將自動(dòng)繼承PC的權(quán)限設(shè)置。

此外，企業(yè)還可以限制手機(jī)端數(shù)據(jù)決策系統(tǒng)的使用人數(shù)。

6、移動(dòng)端定位

在FineReport報(bào)表軟件中，還可以手機(jī)簽到。使用FR.location方法獲取當(dāng)前位置，使用移動(dòng)終端登錄系統(tǒng)，訪問簽到表單，獲取當(dāng)前地理位置和當(dāng)前時(shí)間即可簽到。

釘釘如何表單設(shè)計(jì)？

1/9 分步閱讀

表單建立方法，來到了APP，點(diǎn)下【工作】，如圖。

2/9

【工作】界面，我們接著來點(diǎn)擊下【表單大師】，如圖。

3/9

【表單大師】頁面，我們接著可以點(diǎn)下【創(chuàng)建表單】，如圖。

4/9

【創(chuàng)建表單】界面，輸入表單標(biāo)題，如圖。

5/9

創(chuàng)建標(biāo)題后，我們可以選擇模板，也可以選擇非模板，小編就選擇模板了，接著點(diǎn)下【選好了】，如圖。

6/9

這些模板有設(shè)置好了的，不好，可以刪除，不夠，點(diǎn)下【添加組件】，如圖。

7/9

選擇要添加的組件就好了，如圖。

8/9

我們接著建立好了，點(diǎn)下【保存】，如圖。

9/9

保存成功就可以使用了，如圖。

北大青鳥設(shè)計(jì)培訓(xùn)：提高用戶體驗(yàn)的八種表單設(shè)計(jì)技巧？

表單功能無論是在網(wǎng)頁設(shè)計(jì)還是app軟件開發(fā)領(lǐng)域都得到了大量的使用。

今天洛陽北大青鳥就一起來了解一下，符合用戶體驗(yàn)的表單設(shè)計(jì)需要滿足哪些條件。

1、表單標(biāo)簽需采用合適的展現(xiàn)形式根據(jù)表單的運(yùn)用場景，標(biāo)簽應(yīng)采用對應(yīng)的展現(xiàn)形式，常見的展現(xiàn)形式有以下三種：左標(biāo)簽、頂部標(biāo)簽、行內(nèi)標(biāo)簽。

A.左標(biāo)簽在一些網(wǎng)頁表單當(dāng)中，標(biāo)簽局左是常見的一種形式。

左標(biāo)簽的展示形式給人一種秩序感，也便于用戶在填寫表單的過程中快速的辨別標(biāo)簽內(nèi)容。

左標(biāo)簽的這種形式一般用于網(wǎng)頁當(dāng)中，不適合在手機(jī)端或者小屏下的移動(dòng)端出現(xiàn)，因?yàn)樾∑聊坏某叽缬邢蓿瑯?biāo)簽居左會(huì)占用較大的空間，輸入框就會(huì)受限。

B.頂部標(biāo)簽頂部標(biāo)簽指的是標(biāo)簽位于輸入框上方，這種形式一般出現(xiàn)在一些移動(dòng)端當(dāng)中。

頂部標(biāo)簽可以使輸入框的寬度變大，用戶在填寫信息也可以比較得到完整的展示。

但這種布局方式也有一個(gè)缺不好的點(diǎn)，就是這個(gè)表單可能需要滾屏，用戶才可以看完。

C.行內(nèi)標(biāo)簽行內(nèi)標(biāo)簽常常出現(xiàn)在手機(jī)端的注冊界面當(dāng)中，這樣的設(shè)計(jì)可以節(jié)省頁面空間，所以大部分app的界面設(shè)計(jì)都采用這樣的設(shè)計(jì)。

當(dāng)然，部分網(wǎng)站pc端的表單設(shè)計(jì)中也會(huì)用到這種設(shè)計(jì)。

2、英文標(biāo)簽避免全部大寫一些英文界面的表單設(shè)計(jì)，我們要避免標(biāo)簽的全大寫。

全部大寫的標(biāo)簽容易造成閱讀和瀏覽上的困難。

3、特殊標(biāo)簽需使用合適的輸入框長度對于特定的標(biāo)簽，像驗(yàn)證碼、郵編這樣的標(biāo)簽，在設(shè)計(jì)的時(shí)候需要采用合適的輸入框長度。

畢竟這樣的輸入框是用戶可預(yù)見的，所以輸入框的長度可以不需要太長。

4、復(fù)選框排列需注意在表單中常出現(xiàn)復(fù)選框的設(shè)計(jì)，這樣的情況需要特殊處理。

比如在注冊的過程中，會(huì)有性別的選擇，所以通常設(shè)計(jì)該表單的時(shí)候我們會(huì)將男女橫排在一行。

但是對于內(nèi)容多的情況下，就建議采用豎排的排序方式。

5、主按鈕和輔按鈕需要明確的區(qū)分在表單提交的時(shí)候，出現(xiàn)多個(gè)按鈕的情況下，需要做明確的區(qū)分，這樣有利于用戶在操作過程中方便辨別操作步驟。

版權(quán)聲明：本文內(nèi)容由網(wǎng)絡(luò)用戶投稿，版權(quán)歸原作者所有，本站不擁有其著作權(quán)，亦不承擔(dān)相應(yīng)法律責(zé)任。如果您發(fā)現(xiàn)本站中有涉嫌抄襲或描述失實(shí)的內(nèi)容，請聯(lián)系我們jiasou666@gmail.com 處理，核實(shí)后本網(wǎng)站將在24小時(shí)內(nèi)刪除侵權(quán)內(nèi)容。