當前位置:引力電商 > 電商快報 > 產品拍攝 >
如何解決上傳圖淘寶小產品拍攝技巧片倒轉的問題?
來源:發布時間:2021-10-19 11:09

如何解決上傳圖淘寶小產品拍攝技巧片倒轉的問題?

周末一早兒,天氣甚好。若不與大自然來個自拍,倒辜負了此番好天氣。

饅頭Mant.君隨手打開一款極其小眾的圖片社交app,上傳了剛剛的自拍照。

“loading…loading…100%了!”

誒,怎么上傳的照片方向不對,倒轉了90度!

咋回事兒?上傳的自拍怎么還倒轉了…

1024

首先,說一下什么叫圖片倒轉?見下圖。

圖片倒轉

其實在前言就提到,圖片的倒轉現象是指圖片的方向發生了變化。比如上圖就是豎向式照片在上傳后橫置了。

那為什么會出現圖片倒轉?其實,對于一款app來說,圖片倒轉出現的概率極低。如果app本身采取了一定的“手段”(后面會詳細介紹),那么就根本不會出現圖片倒轉的問題。如果在app沒有采取任何措施的情況下,那只有當上傳的圖片文件過大等才會出現這種問題。

但是,當出現圖片倒轉的問題時應該怎么解決?

各位少俠會yy,在上傳圖片前提前調整圖片方向,將其按照app倒轉方向前置逆向倒轉掉,這樣再去上傳圖片,圖片方向就正常了。

前置逆轉

不過,這種辦法饅頭Mant.君親自嘗試過,答案是“No Way” 。在我測試后發現,有些情況下對圖片的提前逆轉,會導致上傳時不會發生圖片倒轉的現象。那相當于最后上傳的圖片還是倒轉的,只不過這種倒轉是屬于人為造成的。

但是,即便這種方法是有效且屢試不爽的,可還是給用戶體驗上帶來了糟糕的感受,因為在產品的易用性方面極大程度上給用戶帶來了困擾和挫敗感。

今天我們就從產品層思考下,如何去解決圖片倒轉的問題。

方案一 : 事后防控

什么叫事后防控?就是說在問題發生后,給到用戶一個工具或方法去改善它,來防控這樣的問題較大概率地出現。

如果我們在產品上可預見會發生圖片倒轉的問題,是需要給到用戶一個補償措施的。就是說既然上傳的圖片在方向上可能會出現問題,我們可以設計出一個交互組件,來幫助用戶對尚未正式上傳前的預覽圖片進行方向調整然后再上傳。

預覽模式編輯

其實,這是一個完全站在用戶角度設計的產品,調整或不調整由用戶來主導。但對于商業產品卻不一定適合,為什么?比如今天饅頭我是京東pop商家,打算在京東發布商品,需要上傳一些商品圖片送審后上架展示。這里的“送審”和“上架展示”是兩個環節,我在上傳圖片時沒有注意到圖片倒轉,接下來會發生什么?審核人員會看到倒轉的圖片,一旦審核標準放寬(即僅僅審核圖片內容是否含有不健康信息),就會導致商品上架后京東買家看到的商品櫥窗位的圖片都是倒轉的。無論如何,從業務上(買家、賣家、平臺)都是不希望或者不允許這樣的問題出現的。

但這就是這種產品設計的弊端,不能100%去攔截圖片倒轉的問題,絕大程度上取決于用戶的意愿。比如這是一個社交app,少俠你自拍的顏圖在上傳時出現倒轉,很有可能是會選擇調整方向的。但假如12306需要上傳身份證拍照信息,如果沒有強限制方向,少俠你還會費盡周折地調整圖片方向再上傳么?

那還有沒有更好的方案了?有,就是作事前預處理,也是目前絕大多數app會采取的一種手段來防止圖片倒轉的問題。

方案二 :事前預處理

就是說在圖片上傳時讓前端來識別圖片的方向,從而將圖片準確無誤地顯示出來。

但是系統又不是人,怎么可能知道傳過來的圖片的正確方向。即便是人,也有時難以分出圖片方向。不過,系統還真的是可以知道圖片的正確方向的。怎么做到的?實際上,我們用手機或其他數碼設備拍照時,會把一系列的屬性信息附加在圖片文件,這些屬性構成了大家常說的Exif信息。Exif信息中就有一個Orientation屬性字段,屬性值其實就是存放圖片的方向信息。那這樣就好辦了,讓前端引入Exif庫,讀取圖片的旋轉信息,放在圖片上傳的字段里,服務端識別旋轉信息對圖片作一個反向旋轉處理。這樣,圖片倒轉的問題迎刃而解。

電商快報
推薦閱讀
久久久精品