pbootcms网站模板|日韩1区2区|织梦模板||网站源码|日韩1区2区|jquery建站特效-html5模板网

LOFTER輕博模板設計

LOFTER輕博模板設計 三聯教程

  負責LOFTER模板設計工作已有一些時間,一直沒機會寫寫總結,趁此機會寫些文字供大家觀賞!

  或許大家聽的比較多的一句話是:“若把傳統博客比喻為一本書,微博就是一份街頭小報,而輕博客就像是一本雜志。與傳統博客相比,輕博客的方式更簡潔”。

  個人覺得LOFTER首先是個好用的工具,然后才有可能成為一個好的社區。LOFTER必須簡單易用,有一個簡潔的發布操作端口(電腦頁面及移動客戶端),和精美的展示空間(博客模版和Timeline頁面);是的,精美的展示空間——博客模板。

  一、模板的重要性

  首先分享一下我和LOFTER產品策劃章行的交流,他說的一句話:“打個比喻,如果一個產品是一個女人,怎樣才能愛上這個女人呢?你首先看的是她的第一印象,這個姑娘很美,你蠢蠢欲動了,你有了和她交往的欲望,你有了包容她小缺點小毛病的耐心,相處了一下,發現她性格也不錯又有內涵,于是你徹底的愛上她了”。這是感性認識,但是我覺得他說的很對,不是嗎?

  從使用者的角度,博客是為用戶記錄內容展示內容的,模板做的好會為博主的內容加分,就像一套滿意的新衣,穿在身上心情格外開朗。反之糟糕無比!所以模板對于整個產品來說是很重要的。

  它常常充當門面的作用,我想很多用戶并不是先注冊然后才登錄的吧?嗯,是的!有一部份新用戶直接到了個人主頁,直接面對了博客的模板,這個時候面對第一次來的用戶,個人模板就好比產品的門面招牌一樣,會給用戶留下第一印象,愛不愛她就看模板的魅力了!

  關于模板的重要性,我暫且說到這里,我們接下來談談模板的特點。

  二、LOFTER模板特點

  它有四種類型的內容,即:圖片、音樂、文字、視頻四種。

  1、展示圖片的模板:a、通常是為了滿足攝影用戶,圖片展示面積要夠大,夠爽B、模板首頁一屏能看多圖 c、背景要暗,突顯當前圖片 d、邊框的設計讓圖片更突出,或讓圖片更精美e、

  2、展示音樂的模板:a、做成唱片封面的感覺 b、有音樂符號或音樂專輯的外觀 c、CD碟的外觀 d、黑膠碟的質感 e、播放器的元素

  3、展示文字模板:a、信紙質感 b、便簽外觀 c、排版便于閱讀 d、做成一本雜志 e、有翻書特效 f、辦公桌場影、悠閑的氛圍、透著陽光、小資的感覺

  4、展示視頻模板:a、播放器外觀 b、膠片質感的背景 c、背景要灰暗,突顯內容 d、Hover動畫效果 e、電影元素

  備注:沒有講到的地方歡迎大家進行補充

  三、LOFTER模板設計過程。

  上面說到四種類型的模板,在這里我也不一一拿來舉例了,挑選一個去年11月份做的一個橫向又以展示圖片為主的模板,跟大家說一下設計過程。

  當時產品策劃跟我說LOFTER目前有很多豎向排列的模板,即從上到下加載顯示的模板。希望接下來能做一些橫向加載顯示閱讀的模板,而且是以展示圖片為主。

  接到任務后,一般我都會給這個設計定一些基調:為了符合產品氣質,我選擇灰色,另外還有原因是,灰色當背景能適應多種復雜的色彩。就像 Photoshop的制作間的背景色是灰色,當然它的明度是有考究的,我想也是為了適應各種色彩而設計的。在此就不擴大此論點了。另外為了突顯圖片,明度不能太亮。而且內頁顯示要大圖,為了滿足攝友們的需求。要夠爽!

  視覺情感關鍵詞:平穩、舒適、明顯,關鍵詞不宜定太多個,一般我覺得挑三到五個已經精挑細選過的關鍵詞便可,這個觀點非常的主觀,不絕對。但是因為我覺得定多了以后,你很難把所有的關鍵詞都安排到你的作品里去,另外多了以后,很容易出現同義詞,也有時候定多了,還發現有反義詞出現,好比“休閑”“嚴肅”,你又想在畫面里表現休閑,又要表現嚴肅。做不好,就像搬石頭砸自己的腳,那就做死人不賠錢啦!

  在動手之前,突然想起在這之前LOFTER做過一個活動叫:“首頁交給你”。過程稿有很多張是橫版的,覺得可能對我設計橫向模板有幫助!

  (圖一)這張圖以橫向平行的排版,使畫面有了安靜平穩的感覺,如果改成模板的話,登錄框部份可以改成:個人信息和模板常用功能。但是安排在這個位置又太居中了,會搶了內容的眼球。另外它是單圖,模板首頁是多圖顯示的,這點也需要修改一下。

  (圖二)這張也是單圖,看到這張,假想它是一排圖片,從右往左滾動加載顯示會不會很帥?另外,登錄框的位置不能放在黃金分割線上,那樣還會很搶內容的眼球。它應在黃金分割線再偏左一些的地方,更不能在黃金分割線偏右的地方,因為那樣已經在屏幕的外面了。

  (圖三)這張也具備了橫版,但是各方面沒有圖一和圖二適合,就不做多考慮了。

  按著以上的思路,做出了以下博客模板。

  此模板橫向平行滾動讓人有一種平穩的感覺,極少的色彩運用不會令讀者分心,有舒適感, 大面積的留白讓內容更加明顯的展示在讀者眼前了。

  橫向滾動的模版,內容顯示不多,但十分精致,第一塊內容無論是圖片、音樂、視頻、文字,都必須按一樣大小的模塊進行排版設計。

  另外圖片的排版,主要有橫圖和豎圖,經過試驗,最終我們選擇了橫圖100%寬度適應,豎圖使用100%高度適應的方案,這樣大部分橫圖都能完整理顯示出來,而豎圖放在一個橫向的模塊里,兩邊會出現大量留白,但好處是能完整顯示圖片出來。

  這里紅色覆蓋區1024x768PX為最小屏幕做考慮。

  模板內頁以展示大圖為主,滿足攝友的需求。

  相對其它多欄顯示的模板,這個模板的舞臺中心感更強,視覺聚焦,瀏覽每一張圖片都將成為一個焦點,不會被其它圖干擾!

  橫向動態滾動瀏覽的模板,映射著時間軌跡的概念,向左滾動,回到過去,向右滾動,來到現在,并即將穿向未來。它以記錄時效性的經歷為優勢。它的模塊下方都有時間標示。喜歡記錄生活的人,閱讀起來就像是在追尋自已生活的過去,猶如成長的軌跡,溫存著你的生活!

  事實上在不同的藝術形式上,很多時候都崇尚簡約,皆因眾人皆知,創意之處是在于如何精辟取舍!

  粗淺之談,不足之處歡迎大家拍磚!

  本文地址:http://uedc.163.com/9068.html

【網站聲明】本站除付費源碼經過測試外,其他素材未做測試,不保證完整性,網站上部分源碼僅限學習交流,請勿用于商業用途。如損害你的權益請聯系客服QQ:2655101040 給予處理,謝謝支持。

相關文檔推薦

這篇文章給大家詳細介紹了HTML頁面跳轉及參數傳遞問題,需要的朋友參考下吧
這篇文章主要介紹了純css實現照片墻3D效果的示例代碼,可以實現鼠標經過圖片實現改變,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本篇文章主要介紹了純 Css 繪制扇形的方法示例,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
本篇文章主要介紹了一份純CSS loading效果代碼示例,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
這篇文章主要介紹了css 實現文字過長自動隱藏功能,需要的朋友可以參考下
本篇文章主要介紹了詳解CSS3 rem(設置字體大小) 教程,小編覺得挺不錯的,現在分享給大家,也給大家做個參考。一起跟隨小編過來看看吧
主站蜘蛛池模板: 专业广州网站建设,微信小程序开发,一物一码和NFC应用开发、物联网、外贸商城、定制系统和APP开发【致茂网络】 | 垃圾处理设备_餐厨垃圾处理设备_厨余垃圾处理设备_果蔬垃圾处理设备-深圳市三盛环保科技有限公司 | 防堵吹扫装置-防堵风压测量装置-电动操作显示器-兴洲仪器 | nalgene洗瓶,nalgene量筒,nalgene窄口瓶,nalgene放水口大瓶,浙江省nalgene代理-杭州雷琪实验器材有限公司 | 安德建奇火花机-阿奇夏米尔慢走丝|高维|发那科-北京杰森柏汇 | 山东PE给水管厂家,山东双壁波纹管,山东钢带增强波纹管,山东PE穿线管,山东PE农田灌溉管,山东MPP电力保护套管-山东德诺塑业有限公司 | 灌装封尾机_胶水灌装机_软管灌装封尾机_无锡和博自动化机械制造有限公司 | 不锈钢发酵罐_水果酒发酵罐_谷物发酵罐_山东誉诚不锈钢制品有限公司 | 一体化污水处理设备-一体化净水设备-「山东梦之洁水处理」 | 上海办公室装修,写字楼装修—启鸣装饰设计工程有限公司 | 山东石英砂过滤器,除氟过滤器「价格低」-淄博胜达水处理 | 诗词大全-古诗名句 - 古诗词赏析 | 细石混凝土泵_厂家_价格-烟台九达机械有限公司 | 预制舱-电力集装箱预制舱-模块化预制舱生产厂家-腾达电器设备 | 运动木地板价格,篮球馆体育运动木地板生产厂家_欧氏地板 | 杭州顺源过滤机械有限公司官网-压滤机_板框压滤机_厢式隔膜压滤机厂家 | 衢州装饰公司|装潢公司|办公楼装修|排屋装修|别墅装修-衢州佳盛装饰 | 环氧乙烷灭菌器_压力蒸汽灭菌器_低温等离子过氧化氢灭菌器 _低温蒸汽甲醛灭菌器_清洗工作站_医用干燥柜_灭菌耗材-环氧乙烷灭菌器_脉动真空压力蒸汽灭菌器_低温等离子灭菌设备_河南省三强医疗器械有限责任公司 | 大型冰雕-景区冰雕展制作公司,3D创意设计源头厂家-[赛北冰雕] | 乐之康护 - 专业护工服务平台,提供医院陪护-居家照护-居家康复 | 重庆小面培训_重庆小面技术培训学习班哪家好【终身免费复学】 | 无锡网站建设-做网站-建网站-网页设计制作-阿凡达建站公司 | 应急灯_消防应急灯_应急照明灯_应急灯厂家-大成智慧官网 | 东莞市踏板石餐饮管理有限公司_正宗桂林米粉_正宗桂林米粉加盟_桂林米粉加盟费-东莞市棒子桂林米粉 | 小程序开发公司-小程序制作-微信小程序开发-小程序定制-咏熠软件 | 数控走心机-走心机价格-双主轴走心机-宝宇百科 | 艾默生变频器,艾默生ct,变频器,ct驱动器,广州艾默生变频器,供水专用变频器,风机变频器,电梯变频器,艾默生变频器代理-广州市盟雄贸易有限公司官方网站-艾默生变频器应用解决方案服务商 | 海德莱电力(HYDELEY)-无功补偿元器件生产厂家-二十年专业从事电力电容器 | 高考志愿规划师_高考规划师_高考培训师_高报师_升学规划师_高考志愿规划师培训认证机构「向阳生涯」 | 超声波清洗机-超声波清洗设备定制生产厂家 - 深圳市冠博科技实业有限公司 | 石英粉,滑石粉厂家,山东滑石粉-莱州市向阳滑石粉有限公司 | 篷房[仓储-婚庆-展览-活动]生产厂家-江苏正德装配式帐篷有限公司 | 江西自考网-江西自学考试网| 超声波焊接机_超音波熔接机_超声波塑焊机十大品牌_塑料超声波焊接设备厂家 | 针焰试验仪,灼热丝试验仪,漏电起痕试验仪,水平垂直燃烧试验仪 - 苏州亚诺天下仪器有限公司 | 深圳APP开发公司_软件APP定制开发/外包制作-红匣子科技 | 哈尔滨京科脑康神经内科医院-哈尔滨治疗头痛医院-哈尔滨治疗癫痫康复医院 | 提升海外网站流量,增加国外网站访客UV,定制海外IP-访客王 | 天空彩票天下彩,天空彩天空彩票免费资料,天空彩票与你同行开奖,天下彩正版资料大全 | 万家财经_财经新闻_在线财经资讯网 | 扒渣机,铁水扒渣机,钢水扒渣机,铁水捞渣机,钢水捞渣机-烟台盛利达工程技术有限公司 |