行業資訊
您的當前位置: 首 頁 >> 新聞中心 >> 行業資訊

網頁設計后如何交接才能順利落地?

發布日期:2021-08-13 11:46 來源:http://www.borsetmisr.com 點擊:

如今越來越多的網頁需要同時適配多端設備,如果只按這樣的流程,一旦進行適配就容易出現各種錯亂與問題。因此,我們貴陽網絡公司小編建議交接工作還需要更完整一些:

貴陽網絡公司

柵格示意圖可以是簡單的頁面結構框架圖也可以是在設計圖的基礎上進行柵格說明。柵格示意圖的意義在于可以讓開發了解總柵格數和具體某一塊內容所占據的柵格數。這兩個柵格數決定著整個頁面的內容架構,也決定著在不同屏幕響應之后的變化。從前端實現來說,在不同的分辨率下,頁面的寬度也不同,假設同樣分為 12 柵格,每柵格寬度自然也就不同,因此前端更在意的是其實是柵格數。如果有幾份不同尺寸的設計圖,較好也提供各自的柵格示意圖以供對比。不同尺寸的設計稿一般的網頁,建議交接兩個版本就足夠:大屏顯示器和移動端。功能性復雜的網頁,比如后臺等,較好選擇 3 個版本及以上:大屏顯示器,中等顯示器,小屏顯示器。具體的參考分辨率分界點,在上一篇文章中有討論過,這里再貼一遍。如果自己還是無法判斷,那么不妨征求一下前端的意見。


使用常規的標注切圖方法就可以。借助一些插件就可以很輕松做到。但是有一點,通常設計師標注會使用 px 單位,需要完全依賴前端自己去換算成 %、vw、vh、em 等各類前端單位。尤其是在換算百分比的時候更是一件令人頭疼的事。這個問題在藍湖上被解決。不僅標注切圖很輕松,開發還可以在按住「Ctrl」的情況下直接鼠標點擊查看百分比,十分方便。


特殊效果的溝通在頁面設計中有時候會加入一些交互動效設計。特別是一些需要開發使用代碼實現的動效。我更傾向于在設計作品構思前期就與前端溝通一些我的想法。畢竟有時候想法很美好,現實很殘酷。被開發打回來也是一件很頭疼的事。網頁中常用的一些特殊展示效果,比如:鼠標的交互反饋視覺差效果滾動翻頁效果滾動延時觸發動效還有一些炫酷的動效背景有點看不清楚,背景是緩緩旋轉的星空另外有時候會有一些在特殊屏幕上的應用特別的響應方案,除了這些,還會有其他需要提前溝通的內容,越復雜的動效較好越早和前端打好招呼,避免設計完成后卻被反饋無法實現。


界面設計走查這一步會自己進行走查的設計師不多,一般都交給了公司的測試工程師。但其實測試工程師關注的更多還是功能和邏輯,至于界面的一些細節并不一定在意。設計師自己進行走查,是保證還原很關鍵的一步。方法一:使用測試機,在多種設備上進行測試一般互聯網都會有測試機,如果沒有,動用你的「人脈」,和周邊的同事朋友借一借吧?;蛘哂梅椒ǘ?。方法二:使用瀏覽器的開發者模式向前端開發要來開發好的前端頁面,在打開的文件夾里找到一個名為「index.html」的文件,就能在瀏覽器中打開了。接下來打開「開發者模式」。在Chrome瀏覽器中。在網頁的上方可以選擇一些常規的不同界面,也可以自己設置大小。在一定程度上可以替代真實的測試機。懂一些前端知識還可以在右側的代碼中進行一些微調試。

相關標簽:貴陽網絡公司,貴陽網站建設公司,貴陽網站優化公司

客戶案例

13608504011

地址:貴陽市花果園金融街1號19層(18、19、20號)

郵箱:258753805@qq.com 

電話:13608504011

網址:www.borsetmisr.com

貴州網絡推廣

關注好惠搜網絡

貴公網安備 52010202000893號

在線客服
分享