人人爱人人看人人搞,久久夜色精品噜噜亚洲AV,狠狠干免费的成人视频,无码性爱片,先锋影音亚洲AV每日资源网站,热的无码,欧美性爱操逼,亚洲免费黄

最近帶著團(tuán)隊(duì)在做pmtalk app下，由于社區(qū)類產(chǎn)品含有文章、問答2個(gè)必備模塊。

但其實(shí)在產(chǎn)品設(shè)計(jì)前的交互設(shè)計(jì)方案不同，就會(huì)影響前端開發(fā)中技術(shù)實(shí)現(xiàn)的成本和資源要求。

今天以下面的2個(gè)信息流頁面講解做內(nèi)容客戶端一定會(huì)遇到web\native\hybrid3個(gè)架構(gòu)的選擇，我們會(huì)遇到什么問題？

▲ 信息流首頁

上面APP的主頁看起來是文章信息流，鋪滿了產(chǎn)品。是客戶端產(chǎn)品的主頁。顯然這樣的產(chǎn)品是內(nèi)容性主導(dǎo)產(chǎn)品。圍繞著內(nèi)容性產(chǎn)品我們有下面3個(gè)關(guān)鍵模塊

▲ 內(nèi)容性產(chǎn)品要做的文本與頁面關(guān)系

由于客戶端要么使用原生、要么用web、要么使用混合開發(fā)。這一點(diǎn)我之前在3大技術(shù)框架上講解了。

產(chǎn)品經(jīng)理做APP一定要了解的3個(gè)技術(shù)框架：native、web、hybird

技術(shù)討論方案

上圖左邊和右邊分別代表了2種問答詳情的交互。同時(shí)2個(gè)交互方案也帶表2種技術(shù)實(shí)現(xiàn)方案。

左邊是將某個(gè)提問問答詳情下的所有問答以信息流展開。用戶可以在一個(gè)頁面下無需跳轉(zhuǎn)操作就可以訪問所有的回答答案。

右邊是將第一個(gè)回答展示在問答詳情頁，用戶要看下一個(gè)回答則需要點(diǎn)擊查看下一個(gè)或上一個(gè)按鈕。

最后技術(shù)實(shí)現(xiàn)結(jié)果是：

采用左邊方案，如果采用原生的技術(shù)方案撰寫問答詳情。則會(huì)要求包括多個(gè)webviewsUI ，富文本多個(gè)后容易造成app,crash。

解決方案只有要求前端撰寫問答\文章信息流、問答\文章詳情H5，才有右邊交互則可用客戶端、前端共同完成該頁面。

采用右邊的方案，則可以采用混合式開發(fā)。前端只需要撰寫某一個(gè)問答的回答即可，其他內(nèi)容用native。減少了前端人員頁面開發(fā)工作。

若在人員資源有限的情況下，右邊的方案可以有效利用前端開發(fā)、客戶端開發(fā)人員。

所以產(chǎn)品經(jīng)理和UED交互設(shè)計(jì)師即使是一個(gè)功能，用不同的交互設(shè)計(jì)改變用戶操作邏輯，其實(shí)可以避免一些技術(shù)上要浪費(fèi)資源的問題。

方案1是左邊的，通過展示多個(gè)回答。

以問題標(biāo)題展示，展示多個(gè)回答詳情。這樣做的方案有知乎、pmcaff的2個(gè)問答。

pmcaff通過全部采用web開發(fā)的形式，展示了所有回答內(nèi)容。

▲ 知乎通過原生+文本的方式解決問答詳情展示

采取的解決方案是以安卓元素+web的形式解決問答。通過如此的方案，則才能實(shí)現(xiàn)展示富文本、圖片排版的問題。

再思考上面的問題前，我們先要知道，什么是富文本和文本？

文本就是用文bai本編輯器編寫,輸入什du麼就是什麼的文檔.

富文zhi本dao是通過純文本進(jìn)行更高層次渲染和計(jì)算,然後再呈現(xiàn)給你看的文檔.

舉個(gè)簡單的例子:

html等網(wǎng)頁文件中用<font color='red'>我是紅色的字</font>包裹起來的文字會(huì)顯示為紅色.

在純文本編輯器中你看到的是:<font color='red'>我是紅色的字</font>

在富文本(包括瀏覽器等都可算作廣義上的富文檔軟件)你看到的僅是:"我是紅色的字",但這幾個(gè)字是紅色的。

包裹它們前後的標(biāo)簽是用來給富文檔顯示軟件看的,讓它們知道哪些內(nèi)容應(yīng)該被渲染,被計(jì)算.這些內(nèi)容在富文檔軟件中并不會(huì)顯示,除非你看原始代碼.

所以我們想在客戶端APP上實(shí)現(xiàn)文章、問答有圖文、富媒體樣式的場景，用web開發(fā)是必經(jīng)之路。

同時(shí)H5等形式可以在微信生態(tài)下傳播、普通瀏覽器下的打開。幫助產(chǎn)品獲取外部社交平臺(tái)流量

所以在原生的體驗(yàn)和web的選擇上，我們?cè)诜桨干线x了混合式開發(fā)。在回答回復(fù)上采用native的交互，提升用戶在前端體驗(yàn)。

交互方案要求技術(shù)的變更

接下來我們采取下面的交互形式，前面提到的知乎方案和右圖方案要求用戶進(jìn)入回答詳情只能查看到一個(gè)回答。同時(shí)點(diǎn)擊“查看下一個(gè)”才能切換為新的回答。

當(dāng)然帶來的問題是用戶要想遍歷一個(gè)問題下面的所有回答。只能通過一次一次的下一個(gè)查看點(diǎn)擊。

也就是點(diǎn)對(duì)點(diǎn)查看

在這樣交互下，原生的開發(fā)下就只需要承載一個(gè)webview。既能夠最大的帶來體驗(yàn)，也可以滿足富文本展示。

原生的下如果要實(shí)現(xiàn)每一個(gè)回答都展示富文本詳情，技術(shù)上是實(shí)現(xiàn)不了的。比如剛剛前面提到的，在pmcaff下用原生效果支持所有回答內(nèi)容展示。

▲

pmcaff在問答詳情展示多個(gè)回答

pmcaff所有回答內(nèi)容展示，是因?yàn)樵趩柎鹪斍轫撁娑际遣捎脀eb開發(fā)技術(shù)。才能實(shí)現(xiàn)將富文本展示

但隨之帶來的問題交互體驗(yàn)差，和分享體驗(yàn)也較差。

圍繞用戶路徑從客戶端的資訊首頁——詳情頁——分享，這一切都繞不過web開發(fā)。客戶端與前端緊密配合，才能實(shí)現(xiàn)一個(gè)app的落地。

▲ web和native的混合交互

所以當(dāng)選擇用客戶端作為產(chǎn)品早期產(chǎn)品，要考慮是否為內(nèi)容性產(chǎn)品。工具性產(chǎn)品顯然開發(fā)成本會(huì)和web差不多，時(shí)間類似。當(dāng)然原生需要用戶控制版本更新，而webapp則不需要用戶同意即可更新

最后要說下，關(guān)于內(nèi)容性產(chǎn)品的編輯器

有了編輯器才會(huì)允許用戶產(chǎn)生富文本。但編輯器目前大部分團(tuán)隊(duì)都會(huì)選擇開源或第三方的項(xiàng)目。

某開源基于H5的編輯器，可以提供圖片、表情包、文本插入、鏈接、導(dǎo)入文章能力。

回到開頭總結(jié)的，同樣是為用戶提供回答詳情。但2個(gè)不同的交互方案就帶來了2種不同技術(shù)實(shí)現(xiàn)方案。

因此產(chǎn)品經(jīng)理要時(shí)刻知道同樣的目的是解決需求，但是不同的交互方案或差異用戶路徑就會(huì)造成產(chǎn)品研發(fā)的出入。

這也是需要不斷的經(jīng)驗(yàn)積累才能判斷未來的坑。

建議產(chǎn)品經(jīng)理多養(yǎng)成app體驗(yàn)的習(xí)慣，每天或每周固定下載幾個(gè)行業(yè)的產(chǎn)品或競品或要做需求的產(chǎn)品，這樣就會(huì)少采坑。

今天的分享就在這了。

每天體驗(yàn)1款A(yù)PP圈子

我創(chuàng)建了一個(gè)知識(shí)星球。加入后365天，每天體驗(yàn)一款A(yù)PP。提升產(chǎn)品設(shè)計(jì)能力，同時(shí)有1300份體驗(yàn)報(bào)告幫助你找到競品。

從優(yōu)化&建議、商業(yè)模式、運(yùn)營、功能描述、交互設(shè)計(jì)、產(chǎn)品定位至少6個(gè)維度，體驗(yàn)一款應(yīng)用。

▲ 醫(yī)療/金融/電商等行業(yè)APP體驗(yàn)報(bào)告

平均1天1塊錢，掃碼購買即可加入

連續(xù)體驗(yàn)90款應(yīng)用，通過后原路退回

產(chǎn)品經(jīng)理切記：交互方案的改變，就帶來截然不同的技術(shù)成本