在網(wǎng)頁設計中使用失真的圖像始于2017年，當時網(wǎng)頁設計師開始發(fā)揮毛刺效應。隨處可見：視頻，動畫，當然還有圖像。這種效果完美地融入了懷舊風潮，席卷了虛擬世界和現(xiàn)實世界。但是，時間已經過去了。盡管像Young Sheldon或Stranger Things這樣以80年代和90年代為中心的電視連續(xù)劇仍然處于領先地位，但2019年仍向我們承諾了一些新趨勢和癡迷。

這些年來，故障效應正在逐漸普及。但是它設法賦予了另一個時尚的解決方案：圖像顯示失真。它每天都在網(wǎng)頁設計師中越來越受歡迎。該方法非常普遍。乍一看，這似乎是增加幻燈片之間過渡效果的另一個聰明的主意，但它也可以與界面的各種細節(jié)配對。即使是簡單的靜態(tài)圖像塊也可以從中受益。本期專業(yè)網(wǎng)頁設計公司Angle就給大家?guī)硪恍┦纠?

元野
盡管在我們的理解中它沒有傳統(tǒng)的失真效果，但是在此圖像仍然變形。該藝術家能夠實現(xiàn)逼真的窗簾般效果，從而在向下滾動時迫使圖片在風中飛揚。在如此適度的環(huán)境和最小的網(wǎng)頁設計中，效果簡直是光彩照人。它使整個網(wǎng)站看起來精致而簡單。

達拉拉·斯特拉代爾（Dallara Stradale）
沒有人能說達拉拉·斯特拉代爾的官方促銷網(wǎng)站很無聊。該網(wǎng)站是真正的杰作，就像意大利團隊所創(chuàng)造的汽車一樣。它具有創(chuàng)新功能，可以滿足產品本身的意識形態(tài)。因此，每個細節(jié)都很重要，這不足為奇。每個方面都是現(xiàn)代而時尚的。主頁上各主要部分之間的每次切換都會產生奇妙的圖像失真效果，就像戴手套一樣。它將簡單的滾動轉換為表演，使每個區(qū)域都充滿戲劇性。此外由于其模糊性，它自然地模仿了速度感，這也是Dallara Stradale的特色。

行星式

盡管在前面的示例中，速度感是過渡效果的核心，但此處的一種流行的類似液體的效果試圖以其流暢的特性贏得讀者的青睞。通常，在主屏幕輪播中使用圖像失真效果。除了令人討厭的滑動效果之外，我們還可以享受平滑自然和超凡魅力的可愛過渡效果，使每個場景都發(fā)生變化。更重要的是，這種效果還與該機構的銘牌相對應-加強了地球外的高科技氛圍。



馬克斯·柯爾特
世界公認的視覺效果制作人Max Colt的個人作品集還具有失真效果。就像在Planetary中一樣，它改善了旋轉木馬中幻燈片之間的切換，這些幻燈片描繪了藝術家最令人印象深刻的作品。由于具有水啟發(fā)性，因此具有相同的魅力，但與Planetary的解決方案相比，它看起來有點不同。

生意伙伴
由于其基于幾何的失真效果，該網(wǎng)站與我們的其他網(wǎng)站形成了驚人的對比。其他示例以扭曲圖像的波紋效果為中心。在這里，相對較寬的垂直面板和菱形會使場景表面變形。該解決方案與整體盒形氛圍完美配合，做出了重要貢獻。

1MD
1MD是我們綜述中的第一個示例，其中失真效果不伴隨任何偏移。僅在主頁上顯示的部分中使用它來將其與其他部分區(qū)分開。它不僅是動畫背景的一部分，而且還是在中間添加標語的一種媒介。結果，該部分鼓舞人心，而通向“關于我們”頁面的號召性用語看起來可點擊且引人入勝。



精密運行
Precision Run背后的團隊也走了類似的路線。但這一次，他們使用這種流行的解決方案使簡單的靜態(tài)圖片引人注目。這里的主頁包含了復古風格的元素，例如雙色調。巧妙地結合了兩次曝光的失真效果為整個界面增添了美妙的舊時感。它可以完美地與網(wǎng)站上的所有其他內容一起播放，并有效地將圖像置于聚光燈下。



薩斯咖啡廳
SassCafé背后的團隊展示了一種從失真效果中獲取收益的不同方法。他們將效果與遮罩和鼠標交互結合在一起，將英雄區(qū)域變成了游樂場。帶有兩個粗體標語的干凈的黑色畫布首先向在線觀眾致意。如果開始移動光標，您會發(fā)現(xiàn)里面藏著一些東西。有兩個背景圖像。當您將鼠標懸停在標語上時，每一個都將成為焦點。其余時間，圖片保持嚴重變形。解決方案激發(fā)了人們一開始的興趣。這只是一個絕妙的主意。



艾達·索科爾
艾達·索科爾（Ada Sokol）的個人作品集也以幾乎不亂顯示圖像的趨勢為標志。這是我們集合中的另一個示例，它與通常的破舊路徑不同，并與鼠標光標一起使用。你可能已經注意到，英雄區(qū)域包含代表藝術家作品的多個標題。當您將鼠標指針懸停在每個標題上時，就會顯示該圖片。在這種情況下，當你移動光標時，圖片會留下一絲失真的圖形。它使人想起了圖形卡缺少必要的帶寬并且無法跟上用戶移動的情況。這種原始的解決方案自然會鼓勵我們使用網(wǎng)站，從而使我們停留一會兒。

標準圖像效果仍然受到歡迎，但是你必須承認它們已經失去了理想的“哇”因素。在破舊的滑動或彈跳的幫助下吸引注意力變得越來越具有挑戰(zhàn)性。因此，開發(fā)人員總是想出新的方法來保持其網(wǎng)站的吸引力就不足為奇了。而且以前避免的臭名昭著的失真效果現(xiàn)在可以挽救一天。

即使該解決方案暗示了變形和扭曲的外觀，它仍然非常普遍。它在各種細節(jié)方面都表現(xiàn)得很好。但是，受益于它的不僅是滑塊。如實踐所示，該技術可以與基于鼠標光標交互和常規(guī)滾動的解決方案完美協(xié)作。這種效果使普通的事物看起來令人耳目一新，這樣網(wǎng)頁設計就可以吸引更多人來訪問。本期本期專業(yè)網(wǎng)頁設計公司Angle就給大家分享到這里。