1. <strong id="7actg"></strong>
    2. <table id="7actg"></table>

    3. <address id="7actg"></address>
      <address id="7actg"></address>
      1. <object id="7actg"><tt id="7actg"></tt></object>

        如何做一個編輯器產(chǎn)品?

        共 2045字,需瀏覽 5分鐘

         ·

        2021-03-02 11:49



        這是Kevin的第 792 
        原創(chuàng),
        持續(xù)日更,做產(chǎn)品經(jīng)理的創(chuàng)業(yè)斜杠青年。



        2021年后,PMTalk也在馬不停蹄的迭代,和往年不同今年我們的版本速度降了下來,以前一周一個版本,現(xiàn)在PC端2個星期一個版本。

        速度降下來的原因是功能不再新增,主要致力于提高用戶的體驗、和社區(qū)訪問數(shù)量。

        PMTalk上線了3年時間,陸續(xù)接到了作者給我們提過無數(shù)次的同一額問題:“編輯器體驗很差。”同時由于不穩(wěn)定情況,編輯器也常常出現(xiàn)發(fā)布失敗的問題,被作者們吐槽。

        2021年,我們開年后就打算花精力重寫這個編輯器,現(xiàn)在剛剛完成了需求設(shè)計,已經(jīng)接入了研發(fā)階段,由此分享一個編輯器產(chǎn)品的坑。

        1.99%的產(chǎn)品團(tuán)隊會選擇開源編輯器

        無論是移動端還是PC端,大部分團(tuán)隊會因為最終性價比的問題選擇用開源編輯器。

        開源的編輯器包含markdown、和普通富文本編輯器。有很多類型,大家可以在github去查找。

        選擇開源的好處自然而知,而對于一個有了幾年運(yùn)營歷史或用戶量超過10萬的產(chǎn)品來說,自然就會有下面3個問題

        1.業(yè)務(wù)支持性弱

        編輯器產(chǎn)生的內(nèi)容僅僅是文本內(nèi)容,沒辦法和商品、特有內(nèi)容業(yè)務(wù)關(guān)聯(lián)

        2.開源選擇的迭代問題

        后續(xù)難以迭代,編輯器的功能改造也花時間。

        2.編輯器的技術(shù)棧

        一個編輯器的開發(fā)工作主要是集中在前端開發(fā),當(dāng)然涉及到業(yè)務(wù)內(nèi)容產(chǎn)生,比如PMTalk的體驗報告編輯器則需要后端同學(xué)支持


          pmtalk體驗報告搜索 



        編輯器本身的開發(fā)功能是沒有要求技術(shù)壁壘的,但需要的是不斷調(diào)試,比如字體加粗的Ui效果、字體斜體的Ui效果都需要一一給出。

        3.編輯器與內(nèi)容關(guān)聯(lián)度的設(shè)計

        一個好的編輯器即能夠提供優(yōu)質(zhì)的作者內(nèi)容輸入體驗,優(yōu)秀士兵配好槍,同理對于作者來說內(nèi)容的輸入體驗是至關(guān)重要的。這也是我們這個版本強(qiáng)調(diào)做的事情



        但更要注意的是內(nèi)容關(guān)聯(lián)設(shè)計,一個編輯器提供的是內(nèi)容生產(chǎn)工具,但如果沒有和內(nèi)容運(yùn)營結(jié)合起來,也無法給用戶提供信息內(nèi)容。

        所以在產(chǎn)品設(shè)計上我們一定要保證每個內(nèi)容的產(chǎn)生有目的、有方向、有規(guī)劃。這也是市面上為什么許多編輯器會要求提供話題選擇、標(biāo)簽輸入的關(guān)系。

        比如掘金


        比如今日頭條



        比如知乎



        當(dāng)然也有人工分類的方式,注重PGC和深度UGC的板塊,小編審核來完成內(nèi)容分類,提供專業(yè)人士更垂直的內(nèi)容服務(wù)。


        4.編輯器的落地頁


        內(nèi)容發(fā)布后,用戶是返回信息流還是內(nèi)容發(fā)布成功落地頁?行業(yè)上的論壇、社區(qū)都有各類方式,沒有固定的統(tǒng)一標(biāo)準(zhǔn)。

        但有一點是可以肯定的是,鼓勵作者內(nèi)容產(chǎn)生后再分享,才是一個編輯器的目的。拋開純粹做編輯器工具的團(tuán)隊不同,編輯器的落地頁也承載了分享的目的。

        編輯器落地除了提供分享入口外,還有一個重要意義告訴作者發(fā)布成功。內(nèi)容已經(jīng)被投放在平臺

        如果不涉及編輯器落地頁,至少也要給出toast進(jìn)行提示。

        5.編輯器應(yīng)對黏貼、復(fù)制

        事實上現(xiàn)在市面上絕大多數(shù)的文字原創(chuàng)要么是在公眾號編輯器、要么是在公眾號的第三方編輯器、要么是知乎等頭部流量較高的。

        哪里流量高、曝光多,作者也聚集地多

        產(chǎn)品經(jīng)理需要認(rèn)清的現(xiàn)實是:首發(fā)、內(nèi)容產(chǎn)生第一入口作為自己平臺,實際上是很難得。

        所以對于大部分人來說,編輯器需要針對頭部類內(nèi)容進(jìn)行擴(kuò)展支持。最常見的是黏貼、復(fù)制了,能夠允許用戶將首發(fā)內(nèi)容快速同步到自家編輯器上。

        而每一家頭部平臺為了保護(hù)版權(quán),都做了防止黏貼、復(fù)制的處理。比如微信的圖片不能直接黏貼復(fù)制,否則無法展示;知乎禁止轉(zhuǎn)載,導(dǎo)致無法黏貼;

        針對圖片的編輯,需要在編輯器里有黏貼復(fù)制成功提示;在復(fù)制上有進(jìn)度調(diào)提示

        6.編輯器的交互體驗

        一個編輯器涉及到大量的操作,即使用戶選擇黏貼復(fù)制可能也會有delete、換行、字體大小等基礎(chǔ)操作

        因此一個編輯器的體驗,主要是在這里就占了半成以上。

        • 功能入口的點擊
        • 文章列表選擇
        • 文章加載
        • 黏貼復(fù)制進(jìn)度提示
        • 排版效果加載
        • 發(fā)布成功loading提示
        • 編輯器布局切換
        • 編輯器功能切換
        • 文章刪除
        • 文字刪除
        • 圖片刪除
        • 字體加粗
        • 插入鏈接
        • 插入視頻加載
        • 插入圖片加載
        • 引用加載


        .....其他的就不羅列了

        以上是一個編輯器產(chǎn)品的5個步驟,歡迎閱讀。后續(xù)等待我們編輯器上線后再繼續(xù)更新編輯器的相關(guān)能力。




        我的新書




        交易擔(dān)保當(dāng)當(dāng)購物《迭代-社區(qū)產(chǎn)品設(shè)計7步策略》小程序


        購買后公眾號回復(fù):迭代,進(jìn)入讀者群






        行業(yè)內(nèi)資深產(chǎn)品經(jīng)理社群:每天體驗1款app




        我創(chuàng)建了一個產(chǎn)品經(jīng)理社群。加入后365天,每天體驗一款A(yù)PP。提升產(chǎn)品設(shè)計能力,同時有1300份體驗報告幫助你找到競品。


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



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


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



        (進(jìn)群后請看新人手冊)





        推薦閱讀:

        情人節(jié)小技巧|用產(chǎn)品思維找女/男朋友

        產(chǎn)品經(jīng)理必了解的技術(shù)架構(gòu)




        瀏覽 86
        點贊
        評論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報
        評論
        圖片
        表情
        推薦
        點贊
        評論
        收藏
        分享

        手機(jī)掃一掃分享

        分享
        舉報
        1. <strong id="7actg"></strong>
        2. <table id="7actg"></table>

        3. <address id="7actg"></address>
          <address id="7actg"></address>
          1. <object id="7actg"><tt id="7actg"></tt></object>
            稚嫩A∨一区二区三区 | 狠狠爱免费视频 | 国产伦清品一区二区三区 | 国产午夜成人精品视频 | 亚洲欧美性爱视频在线观看 | 女女同性女同1区二区三 | 小美女操逼 | 从头啪到尾全肉的动漫 | 五月天丁香情色 | 性一交一乱 |