根據(jù)我們制作優(yōu)秀的 iOS 應(yīng)用的經(jīng)驗(yàn)，我們認(rèn)為設(shè)計(jì)師應(yīng)該在心里的牢記適用于 iOS 的 5 件事。雖然本文關(guān)注的重點(diǎn)只在 iOS 應(yīng)用，但大部分的意見(jiàn)也適用于其他移動(dòng)平臺(tái)。

1. 了解您的媒體

這似乎是顯而易見(jiàn)的，設(shè)計(jì)應(yīng)用而不是網(wǎng)站實(shí)際上需要轉(zhuǎn)變思維方式。應(yīng)用不是網(wǎng)站，不應(yīng)該像他們一樣設(shè)計(jì)。讓我們來(lái)談?wù)動(dòng)嘘P(guān)細(xì)節(jié)。

應(yīng)用有完全不同與網(wǎng)站的用戶(hù)交互模型：敲擊與點(diǎn)擊，視圖與頁(yè)面，按鈕與鏈接等。我們相信，討論應(yīng)用設(shè)計(jì)語(yǔ)言的變化，可以幫助我們保持正確的心態(tài)。

除了不同的交互模型，應(yīng)用應(yīng)該有不同的方式。不要在一個(gè)視圖放置太多內(nèi)容；分隔不同功能到不同的視圖。由于屏幕空間更受限制，這在 iPhone 上比 iPad 上更為重要。

用戶(hù)使用應(yīng)用與網(wǎng)站有完全不同的考慮。應(yīng)用程序的導(dǎo)航層次結(jié)構(gòu)往往比在網(wǎng)站上更窄，更深入。用戶(hù)點(diǎn)擊幾次為了實(shí)現(xiàn)某種目標(biāo)或訪問(wèn)某些內(nèi)容，不要把一次性在屏幕上放置太多內(nèi)容從而阻止這種自然的鉆井式行為。

iOS 上導(dǎo)航有很大的不同 – 這里沒(méi)有 Chrome 瀏覽器或后退按鈕。由于 iOS 的推出，出現(xiàn)了許多導(dǎo)航方式，哪一個(gè)是最適合你的應(yīng)用程序依賴(lài)于您的特定需求。去看看 Pttrns，包括很多優(yōu)秀應(yīng)用的界面導(dǎo)航方面。

最后，請(qǐng)記住在 iOS 設(shè)備上運(yùn)行的 iOS 的應(yīng)用程序。啊，是吧？但這一點(diǎn)是很重要。呈現(xiàn)半透明內(nèi)容與圓角和陰影圖像與動(dòng)畫(huà)漸變疊加的基礎(chǔ)上可能會(huì)導(dǎo)致性能問(wèn)題。與開(kāi)發(fā)人員在界面中執(zhí)行棘手的設(shè)計(jì)工作想出一個(gè)方法，而不會(huì)導(dǎo)致用戶(hù)明顯感覺(jué)滯后。

Wikipedia 上有一個(gè) iOS 設(shè)備列表, 但是我們還是將所有運(yùn)行 iOS 6 的設(shè)備列出來(lái)，希望這將有助于您在設(shè)計(jì)應(yīng)用時(shí)能夠提供優(yōu)雅的體驗(yàn)與硬件兼容性上做出明智的決定。

?2. 設(shè)計(jì)的通用性

我們本領(lǐng)最好的應(yīng)用能通用性的工作。這意味它們能在 Retina 屏幕與非 Retina 屏幕， 加長(zhǎng)屏幕與短屏幕，iPad, iPhone 與 iPod touches 等都很好的工作。

這很困難，但我們有幾個(gè)簡(jiǎn)單的技巧讓您滿(mǎn)足 80％。

避免奇數(shù)大小的 Retina 圖形

非 Retina 內(nèi)容必須準(zhǔn)確的為 Retina 內(nèi)容的一半大小 。 這意味者如果 Retina 內(nèi)容尺寸為 101 像素，非 Retina 內(nèi)容為 50.5 像素，這是不可能的。不要使用奇數(shù)大小的 Retina 圖形讓您和您的開(kāi)發(fā)人員不要為這個(gè)問(wèn)題頭疼了。

讓點(diǎn)擊目標(biāo)足夠大

請(qǐng)記住用戶(hù)使用你的應(yīng)用與 Web 瀏覽器的不同？好了，他們也沒(méi)有鼠標(biāo)。相反，所有與您的應(yīng)用互動(dòng)都是用一個(gè)不太精確的儀器：手指。

為了確保用戶(hù)可以方便地與您的應(yīng)用程序的接口進(jìn)行交互，確定他們可以點(diǎn)擊的操作區(qū)域至少有44點(diǎn)寬和高。

3. 基于設(shè)備設(shè)計(jì)

iOS 設(shè)備的像素密度有一個(gè)波動(dòng)范圍，且對(duì)顏色的呈現(xiàn)各不相同。在設(shè)計(jì) iOS 應(yīng)用時(shí)，你應(yīng)該考慮到這點(diǎn)。

為了明確你的應(yīng)用的顯示情況，你應(yīng)該在多個(gè)設(shè)備上呈現(xiàn)它：視網(wǎng)膜和非視網(wǎng)膜屏、長(zhǎng)屏或短屏、iPad或iPhone。你可以使用 LiveView 或 Skala 在你的設(shè)備上模擬顯示你的 photoshop 文件。最后，不要忘記調(diào)整屏幕亮度，以保證在所有情況下，你的應(yīng)用都能完美展現(xiàn)。

4. 界面動(dòng)畫(huà)

iOS 動(dòng)畫(huà)很簡(jiǎn)單 – 蘋(píng)果已經(jīng)為應(yīng)用可以很容易的創(chuàng)建過(guò)渡動(dòng)畫(huà)做了很多工作。您應(yīng)該充分應(yīng)用它。

不幸的是，動(dòng)畫(huà)在 PSD 中不是很容易體現(xiàn)和轉(zhuǎn)換到 iOS 中。最好的方式是和開(kāi)發(fā)人員共同在設(shè)備上設(shè)計(jì)動(dòng)畫(huà)原型。總之，您可以創(chuàng)建一次性的應(yīng)用，探索您的動(dòng)畫(huà)想法。這將讓您得到一個(gè)準(zhǔn)確的動(dòng)畫(huà)實(shí)際表現(xiàn)效果的感受。

在設(shè)計(jì)動(dòng)畫(huà)時(shí)，利用用戶(hù)已經(jīng)熟悉的習(xí)慣，當(dāng)他們點(diǎn)擊一個(gè)項(xiàng)目時(shí)新的視圖從右邊滑入，他們希望創(chuàng)建新的內(nèi)容時(shí)從下往上滑動(dòng)視圖。在自己的自定義視圖中模擬這些運(yùn)動(dòng)動(dòng)畫(huà)，不要設(shè)計(jì)一個(gè)用戶(hù)不習(xí)慣的新動(dòng)畫(huà)。您應(yīng)該學(xué)習(xí)用戶(hù)習(xí)慣的操作方式，讓您的應(yīng)用程序?qū)τ脩?hù)更熟悉,更友好。

5. 早期涉及開(kāi)發(fā)人員

我們相信開(kāi)發(fā)人員在設(shè)計(jì)過(guò)程的早期參與，并繼續(xù)參與后期的開(kāi)發(fā)過(guò)程中，設(shè)計(jì)人員和開(kāi)發(fā)人員之間的協(xié)作將制作出更好的應(yīng)用。

實(shí)現(xiàn)任何相當(dāng)復(fù)雜的設(shè)計(jì)是實(shí)現(xiàn)者的挑戰(zhàn) – 更好的解決方案讓開(kāi)發(fā)人員可以更早的開(kāi)始思考解決這些問(wèn)題。

開(kāi)發(fā)者知道我們的所有設(shè)計(jì)不一定都能實(shí)現(xiàn)，所有讓設(shè)計(jì)人員與開(kāi)發(fā)人員一起工作，我們可以不用重復(fù)一些不必要的工作。

所以您知道應(yīng)用程序而不是網(wǎng)站。設(shè)計(jì)普遍。在設(shè)備上的設(shè)計(jì)。動(dòng)畫(huà)是很棒的。早期讓開(kāi)發(fā)人員涉及讓您的設(shè)計(jì)以您的方式實(shí)現(xiàn)。

英文原文鏈接：5 Things to Know When Designing for iOS

via:APKBUS