這個話題在前邊已經寫過一些, 看豆瓣上 關於 webcity 一些新的想法
中間一些想法醞釀了比較長時間了, 這次也當作是乙個整理吧
這篇文章在介面設計方面寫一點, 配圖也是網上的, 沒有經過加工, 需要點想象啊
由於我沒有足夠的設計能力, 相關技術也不成熟, 因此 demo 暫時不會有
雙十一沒有買東西, 網頁沒有細看, 只是掃了一眼**京東跟蘑菇街
京東加強了導航難看實用, 蘑菇街設定了區分明確的板塊風格清晰.. 興趣不大
天貓做了個地圖, 這一點我覺得很有意思, 某種程度上也 webcity 有點像
當 web 上內容更加豐富, 怎樣呈現才是更友好的? 至少不能用機械化的列表!
我想這是乙個**朝著類似方向發展的另乙個徵兆
webcity 並不是乙個只是為了桌面上方便人查詢**而設想的頁面
特別因為線上社群大量增多, 桌面電腦大小的螢幕通常是不夠的
webcity 設想的場景是地鐵廣告那麼大的螢幕, 支援手勢語音直接操作
當然出於各種原因, 一定是基於桌面版開發和相容的
我設想達到的是這樣一些目標:
現在**越來越多, 以搜尋作為入口是不夠優化的, 也不夠友好
我猜想人們喜聞樂見的還是在頁面上平鋪開來, 還有按照分類分開多個頁面
所以簡單理解就是會有非常多網頁, 每個網頁上有很多卡片式的入口同向站外
但是就像人們無論去**都先上街一樣, webcity 當中的"通道"的概念必不可少
同時街道的作用也可以標記位置, 因此人們不需要記憶各個建築的經緯度
同時街道直接相互聯通, 作為在建築直接切換的途徑, 也可以說是引導
因此作為索引, 一方面收錄**, 一方面建立**之間的關聯
上邊是最初覺得適合 webcity 用的乙個樣式, 因為這個排列顯得美觀
美觀的介面才有可能被人用在桌面, 或者廣告, 或者用來裝飾牆體
試想未來城市裡到處是螢幕, 也許全都會顯示可互動的廣告
而這樣的介面除了美觀, 也對應了人們熟悉的網上乙個經常光顧的場所
這個網路和現實產生關聯的感覺, 比起海報或者廣告片也挺有趣的
我傾向於和現在的**一樣採用卡片的簡單結構, 將裝飾放到配色和背景上
這樣的介面易於使用演算法進行堆積和調整, 每個單元能相對一致得受到關注
極端的情況比如廣告顏色太多, 卡片也能通過間距一起降低相互的干擾
而圖中卡片的傾斜, 純粹是為了在視覺上避免單調
前面已經提到了"通道"的概念, 作為一種手段, 展現出**的關聯
用另外乙個角度理解, webcity 就是為網上那麼多的**創造一些關聯
假設人們因為一些需求通過 webcity 去訪問一些**極其相關資訊,
那麼, 將有巨大的流量, 一方面要更快滿足流量需求, 一方面激發更多的需求
找個比喻就像植物的根系, 伸向土壤中的養分, 同時讓土壤更活躍
於是這些卡片組成是連貫的整體, 即便切換位置, 也會加有用意的專場動畫
原來展示, 兩個位置是網際網路地理上相關聯的, 那是這一邊, 這是在這一邊
所以卡片之間會留一些入口, 提供遊客停下交流的地方, 對, 就像阿爾法城的聊天
當然我期待的是還有其他的互動方式, 相對到那時候自然而然會冒出來
而這些是模仿現實中的城市, 乙個地方, 就有乙個地方人們留下來的氛圍
webcity 上地點也可以和現實中對應, 比如外灘, 恐怕就能佔滿整頁
還記得前邊說的大螢幕, 這些螢幕也許就在對應的廣場或者街道出現
虛擬世界總之不會繼續是漂浮在空中樓閣, 而是跟現實充滿了交點
介面上會隨著出現很多跟地點配合的元素, 在背景配色以及布局上邊
相對來說, 方格的介面規整很多, 傳達內容更清晰, 但是畫面感較弱
雖然我個人對菱格更喜歡, 但在 web 的實踐當中也許方格經常會實用
如果允許更隨意的排列, 相信畫面的效果會比菱格還要好很多
只是這樣的話就不能通過程式直接生成和後期處理了
而且這樣的格仔有的沒有明確的順序, 進行關聯時要再額外做考慮
我只是想說, 當圖形介面引入更多樣的布局, 真的能非常漂亮
還有一張圖讓我很有啟發, 就是下面這張, 圖中間有一條分割線
這條線像是一條街把所有的方塊都聯通起來了, 成了乙個整體
這樣使用者訪問時就有了乙個極好的引導, 而不是隨意地掃視這些方塊
網頁上雖然瀏覽的方式不同, 一條街線還是很能把注意力貫穿起來的
以上零零碎碎都還是想法, 以後想到會繼續補充
關於介面的一些思考
下面示例是模擬遊戲 憤怒的小鳥 的實現。叫的方式的介面 public inte ce shouttype 嗷嗷叫 public class aoshout implements shouttype 喳喳叫 public class zhashout implements shouttype 鳥的抽象...
關於寫介面的一些註解 更新中
暫時更新幾個swagger的註解 api value 說明 tags api value 品類表 tags restcontroller category public class categorycontroller apioperation value 介面說明 介面請求方式 response ...
除錯介面的一些方法
什麼事情都是有乙個順序的，除錯也一樣，遵循一定的步驟就可以進行錯誤的逐一排查。方法二 看執行的程式裡面是否出現timeout這種錯誤。方法三 直接把訪問的ulr複製到瀏覽器裡面執行，看看結果。分為 get和post命令 get命令 方法一 通過瀏覽器來除錯這乙個介面 非常好 方法二 通過debug來...