一、產品定點
這是一個網上點餐軟件,為用戶提供集點餐、送餐于一體的服務。在為消費者節省大量時間的同時,幫助消費者發現更多更好的美食。
二、項目背景
隨著都市生活節奏的加快,大多數人忙到連給自己做一頓美食的時間都沒有,對于這類 很忙碌但又想品嘗到不同美食的人,網上點餐成為了他們必要的需求,我們的產品就在 這種情況下產生。點餐軟件很好的解決了大部分都市人群關于吃飯的問題,在幫他們節 省了大量時間的同時,也幫助他們發現更多更好的美食。
三、目標人群
主要目標用戶是都市中忙于工作的白領,學業繁忙的學生。

四、apppark.cn" target="_blank">APP軟件界面設計
1、首頁界面設計
主要頁面統一采用大標題的設計風格,此處的卡片以圖片疊加文字的方式處理,為了不影響閱讀,在卡片的上方加一層白 色漸變突出文字。用戶可以點擊查看按鈕, 查看更多關于該店鋪的內容。
界面的背景顏色使用淺灰色,卡片的顏色 使用純白色,因為灰色在視覺上相對靠后 白色在視覺上相對靠前,這樣整個頁面看 起來有明暗對比,更富有層次感。
操作區的圖標使用線性圖標,在配色上采 用深黑色加高飽和度高亮度的紅色,這是 一組經典配色組合,形成對比又不單調, 整體看起來清爽、和諧又富有趣味。
2、apppark.cn" target="_blank">APP軟件詳情頁界面設計
在店鋪詳情頁上,主要信息以頂部圖片加 卡片的形式表現。并且在圖片下方疊加一 層白色漸變,達到與背景的統一融合,同 時更好地與卡片自然銜接。在卡片中可以查看店鋪的詳情介紹、營業 時間、具體地址以及評分情況。
3、食物制作詳情
在食物制作介紹頁面,可以查看食物的制作方法,同時將食材清單以十字交叉的交 互形式呈現出來,節省了頁面空間的同時 減少用戶操作成本,簡單快捷。在頁面下 方以圖標加文字的形式將食物的熱量、溫 度等參數展示給用戶,一目了然。
4、購物車界面
在購物車里顯示之前添加過的商品,將商 品的具體信息以卡片的形式呈現,視覺上 簡潔又易于理解。點擊結算后進入訂單核 對頁面,核對頁顯示消費者的個人信息以 及訂單詳情,簡潔易懂。
5、送餐員騎行軌跡
當用戶下單后,會在送餐地圖上顯示送餐 員的騎行軌跡,走過的路線以彩色的形式 標識,未走過的路線顯示灰色,同時在送 餐員頭像旁顯示送餐狀態,讓用戶隨時了 解送餐情況并感到這是一個可控事件,從 而緩解用戶等餐時的焦慮情緒。
6、送餐員詳情
當向上滑動時會隱藏地圖,以文字的形式 顯示配送狀態。用戶可以查看卡片中送餐員的具體信息、訂單詳情及撥打電話聯系
7、店鋪推廣介紹
左邊是店鋪名稱和店鋪宣傳文案,右邊是 店鋪的整體評分,再配以圖片,在視覺上 達到圖文結合的目的。每一個店鋪為一組, 組與組之間用分隔線隔開。所有的信息梳 理有規律又富有節奏,便于用戶瀏覽理解。
8、店鋪詳情介紹
店鋪詳情頁頭部以圖片的形式呈現,當用 戶點開該頁面的時候形成一定的視覺沖擊。 中間的內容介紹以圖文結合的形式呈現, 整個布局張弛有序,讓用戶看起來不會平 淡無趣。
9、優惠卡券頁面
在卡券設計上,左邊顯示具體金額,右邊 以文字的形式說明卡券的使用方式,再在 右上角上疊加一個降低透明度的圖形,這 樣既能達到平衡版面的作用,又不會造成 視覺干擾。在顏色使用上,同種類型的卡 券使用同種顏色,顏色與顏色之間的關系 是相鄰色,這樣整體看起來即統一又對比。
10、錢包余額設計
余額是為數不多視覺,所以在字體樣式上使用 加大加粗的紅色表示。收入支出是次要信 息,在字體樣式上用較小的黑色表示。形 成對比,凸顯重要信息。整體圖標以圓形呈現,圖標背景吸取主體 圖標的顏色并降低透明度,形成層次感。 圖標與圖標之間的顏色使用相鄰色,這樣 整體風格趨向統一。