跳出思維圈,“類H5”助你市場推廣一臂之力

HTML5按咒,也就是我們常說的H5迟隅,它是一種標記語言,主要用于網(wǎng)站的編寫和Web App的開發(fā)胖齐。H5制作的網(wǎng)頁可以說是現(xiàn)在網(wǎng)絡(luò)推廣玻淑、促銷方面的利器。其優(yōu)點主要體現(xiàn)在兩個方面呀伙,一是豐富的動效支持补履,二是查看方便。H5近年來越來越受到人們的喜愛剿另。

但是箫锤,使用H5做開發(fā)贬蛙,并不是人人都能做的,需要大量的編程語言和開發(fā)的基礎(chǔ)谚攒,而一些所謂的簡單設(shè)計H5的工具功能又不完善阳准。如果我不會js,不會HTML5語言馏臭,怎么能做出一個“類H5”的簡單App呢野蝇?

作為產(chǎn)品小白的熊先生最近正在悶頭做原型,在制作的過程中忽然發(fā)現(xiàn)括儒,自己的設(shè)計其實完全可以應(yīng)用到H5網(wǎng)頁這樣的推廣當中绕沈。最近正在做一個旅游相關(guān)的app,那么我就幫忙幫到底帮寻,做一個旅游活動推廣的“類H5”推廣原型吧乍狐。

開始之前,我們需要確定一個原型設(shè)計工具固逗,就用Mockplus好了浅蚪,最近一直在用,拿來也比較順手烫罩。

然后惜傲,列好大鋼,編輯項目樹嗡髓。良好的規(guī)劃是優(yōu)秀的設(shè)計中必不可少的一部分操漠。

接下來,我們開始頁面的設(shè)計饿这。

第一步:載入動畫浊伙。

載入動畫是H5頁面標志性的效果之一,“類H5”當然也不能忘記這一點长捧。

方法:導(dǎo)入需要的圖片嚣鄙,根據(jù)頁面的內(nèi)容,設(shè)置某些組件為不可見串结;拖拽它們各自的鏈接點設(shè)置“載入時”顯示自己的交互效果哑子。并且給部分組件設(shè)置上移動的動畫效果,使得整個頁面更加生動肌割。


第二步:設(shè)置交互效果卧蜓。

使用原型設(shè)計工具來設(shè)置“類H5”網(wǎng)頁最大的優(yōu)勢就在于:原型設(shè)計工具有更多的交互效果,你想要的總有辦法可以實現(xiàn)把敞。這里我們先簡單的設(shè)置一些彈窗的效果弥奸。比如,關(guān)于旅行社的介紹奋早、導(dǎo)游的相關(guān)資質(zhì)盛霎、旅游線路的介紹等等赠橙。

方法:拖拽出相應(yīng)的彈窗組件,雙擊打開設(shè)計愤炸。然后拖拽頁面中組件的鏈接點到彈窗上期揪,最后設(shè)置彈出的效果。


第三步:頁面跳轉(zhuǎn)规个。

在用戶比較感興趣的內(nèi)容區(qū)域設(shè)置頁面的跳轉(zhuǎn)凤薛,重點內(nèi)容用新的頁面來講解,減少其他內(nèi)容的干擾诞仓,不僅保證了吸引用戶的眼球枉侧,更加保障頁面運行的流暢程度。

方法:設(shè)置頁面的跳轉(zhuǎn)效果對原型設(shè)計工具來說完全是小菜一碟狂芋,Mockplus只需要一個簡單的拖拽動作就可以搞定了。


第四部:在線發(fā)布憨栽。

設(shè)計做的再好帜矾,沒人欣賞怎么行?可是屑柔,要怎么才能把這樣一個“類H5”的原型項目發(fā)出去呢屡萤?

方法:發(fā)布。有了這個功能掸宛,你就可以把做好的作品上傳到Mockplus的服務(wù)器死陆,然后拿著這個鏈接分享給你的客戶們了。而且唧瘾,Mockplus可以很簡單的就做到全屏演示的效果措译。怎么樣,是不是很神奇饰序?


設(shè)計的內(nèi)容比較簡單领虹,主要是希望大家能夠明白這個意思。

熊先生覺得:市場也好求豫,設(shè)計也好塌衰,我們更注重的是得到的結(jié)果,而不是手中的工具蝠嘉。雖然使用原型設(shè)計工具來實現(xiàn)H5網(wǎng)頁似乎有些風(fēng)馬牛不相及最疆,但是只要能夠解決實際的問題,何必要墨守在固定的模式里呢蚤告?

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末努酸,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子罩缴,更是在濱河造成了極大的恐慌蚊逢,老刑警劉巖层扶,帶你破解...
    沈念sama閱讀 216,496評論 6 501
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異烙荷,居然都是意外死亡镜会,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,407評論 3 392
  • 文/潘曉璐 我一進店門终抽,熙熙樓的掌柜王于貴愁眉苦臉地迎上來戳表,“玉大人,你說我怎么就攤上這事昼伴∝倚瘢” “怎么了?”我有些...
    開封第一講書人閱讀 162,632評論 0 353
  • 文/不壞的土叔 我叫張陵圃郊,是天一觀的道長价涝。 經(jīng)常有香客問我,道長持舆,這世上最難降的妖魔是什么色瘩? 我笑而不...
    開封第一講書人閱讀 58,180評論 1 292
  • 正文 為了忘掉前任,我火速辦了婚禮逸寓,結(jié)果婚禮上居兆,老公的妹妹穿的比我還像新娘。我一直安慰自己竹伸,他們只是感情好泥栖,可當我...
    茶點故事閱讀 67,198評論 6 388
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著勋篓,像睡著了一般吧享。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上生巡,一...
    開封第一講書人閱讀 51,165評論 1 299
  • 那天耙蔑,我揣著相機與錄音,去河邊找鬼孤荣。 笑死甸陌,一個胖子當著我的面吹牛,可吹牛的內(nèi)容都是我干的盐股。 我是一名探鬼主播钱豁,決...
    沈念sama閱讀 40,052評論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼疯汁!你這毒婦竟也來了牲尺?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 38,910評論 0 274
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎谤碳,沒想到半個月后溃卡,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,324評論 1 310
  • 正文 獨居荒郊野嶺守林人離奇死亡蜒简,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 37,542評論 2 332
  • 正文 我和宋清朗相戀三年瘸羡,在試婚紗的時候發(fā)現(xiàn)自己被綠了。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片搓茬。...
    茶點故事閱讀 39,711評論 1 348
  • 序言:一個原本活蹦亂跳的男人離奇死亡犹赖,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出卷仑,到底是詐尸還是另有隱情峻村,我是刑警寧澤,帶...
    沈念sama閱讀 35,424評論 5 343
  • 正文 年R本政府宣布锡凝,位于F島的核電站粘昨,受9級特大地震影響,放射性物質(zhì)發(fā)生泄漏窜锯。R本人自食惡果不足惜雾棺,卻給世界環(huán)境...
    茶點故事閱讀 41,017評論 3 326
  • 文/蒙蒙 一衬浑、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧放刨,春花似錦工秩、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,668評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至螟碎,卻和暖如春眉菱,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背掉分。 一陣腳步聲響...
    開封第一講書人閱讀 32,823評論 1 269
  • 我被黑心中介騙來泰國打工俭缓, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人酥郭。 一個月前我還...
    沈念sama閱讀 47,722評論 2 368
  • 正文 我出身青樓华坦,卻偏偏與公主長得像,于是被迫代替她去往敵國和親不从。 傳聞我的和親對象是個殘疾皇子惜姐,可洞房花燭夜當晚...
    茶點故事閱讀 44,611評論 2 353

推薦閱讀更多精彩內(nèi)容

  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 172,075評論 25 707
  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫、插件椿息、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 12,094評論 4 62
  • 昨天發(fā)出了三個疑問歹袁,在生活中經(jīng)常面臨的情境坷衍。 1.你到的認為自己行不行? 害怕不好的評價条舔,謹小慎微枫耳,維護一個好印象...
    部落10閱讀 1,125評論 0 0
  • 每個人都有討厭的人,喜歡的人逞刷。厭惡的事和喜悅的事嘉涌。作為這個社會的人,我們面對各種挑戰(zhàn)夸浅,做出各種選擇仑最,但有的人卻并...
    大魔女閱讀 182評論 0 0
  • 01自律雞湯 最近自律這個詞很時髦了警医,朋友圈滿滿都是。 你為什么現(xiàn)在一事無成坯钦,因為你的不自律预皇! 你為什么還那么...
    中醫(yī)二羊閱讀 327評論 6 6