C端設計展示目前院校庫頁面院校分類邏輯有待改進,排名顯示較為混亂不夠直觀,卡片有效信息不足,卡片設計刺激用戶點擊,需相應增加跳轉鏈接提供更多有效信息,原有頁面引導用戶引導性按鈕缺乏,影響用戶留存率和機構咨詢率等指標。
1整體頁面設計頁面排版基本不變,上方分類欄設置國家優先,改原有全球顯示為國家,,專業排名改為專業。頁面右側添加兩個icon,分別對應原有的智能匹配和一鍵咨詢(人工咨詢)兩個功能,參考更新后功能名稱,整體布局如下圖
2.1所示。
原版:
修改后:
2頁面上方選擇菜單邏輯設置
(1)當具體選擇排名類別時,下方院校僅顯示所選排名,其余排名隱藏,如圖
2.2所示。
(2)
院校排名支持不填,如麻省理工學院THE排名不填,則在THE排名篩選下不顯示麻省理工學院。
B端設計展示根據上述c端的改動,b端機構測評頁面也相應地需要做出一些改動,如下所示。
在院校庫編輯信息輸入界面,排名上方增加排名可下拉選項,對應前端排名選擇,前端僅顯示已勾選排名,如下圖所示。
院校庫院校介紹界面設計
C端設計展示目前,院校庫功能整體使用價值偏低,有效信息不足,且無核心功能與咨詢窗口跳轉設置,對平臺機構咨詢率、銷售轉化率等指標貢獻較低,為進一步激活院校庫板塊,增設院校庫詳情介紹頁。
1整體頁面設計整體由藍色框與四個白色信息卡片構成,藍白框重疊,白框統一圓,4,白框間間距為10,所有白框與校徽圖片左側對齊。
新頁面
2院校簡介
背景設置為純藍,左側校徽圖片大小為100(含留白部分),無圓角。右側文字顏色統一為白色,院校中文名字體加粗,字號20,與校徽圖片頂部平行;院校英文名字號14,字體不加粗;
第三行定位圖標與英文名首字母對齊,顏色為#A6B9D1,圖標寬13,高15;位置文字位于定位圖標后1,字號14;
分割線粗細為1,白色,寬251,左側與英文名首字母對齊;
第四行排名字號14,不加粗,與英文名首字母對齊,排名間由分割線隔開,分割線粗細為1,白色,寬15。
3校園風光卡片邊框底部白色填充,圓角4,寬373,高128;
標題字號為16,顏色:#4C94F2,距卡片左側與頂部1;分割線居中,寬357,粗細1,顏色:#918F8F,距標題1;照片大小82,圓角4,向左滑動可看到其他圖片。4學校簡介藍色標題與分割線同上;簡介內容字號14,左對齊,與標題首字對齊。
5專業列表藍色標題與分割線同上;院系滾動欄字號15,無選中時顏色為:#505051,選中后字體加粗,顏色為:#294184,向左滑動可看到其他院系名稱;
專業學位展開前限制行數為4,由中文名與英文名構成,中文名字體加粗,英文名不加粗,字號均為14;
展開全部字號16,顏色為:#4C94F2,距卡片下側邊緣約1,居中;回收圖標顏色同上,大小27。
6地理位置藍色標題與分割線同上;左側貼紙圓形40,圓形填充色為:#DEE7F8,中
間貼紙顏色為#294184,居于圓形中央,大小約29(需根據貼紙實際情況靈活調整),貼紙間距為12;
文字字號14,黑色,類型字體加粗,具體內容不加粗。B端設計展示根據前端頁面設計,后臺對應增設新功能。
1整體頁面設計后臺路徑為學院庫(一級)學院庫(二級)介紹;
整體排版,結合前端信息卡片與陳列方式,后臺相應分設板塊與設置信息填寫順序。
2院校簡介排名增加顯示與隱藏按鈕。
3校園風光圖片上傳數量限制8張,尺寸為200*200px像素以上,大小2M以下。
4學校簡介內容字數限制,由運營人員結合前端實際情況進行控制(前端控制在5行)。
5專業列表院系與對應專業換行輸入。
6地理位置內容字數限制,由運營人員結合前端實際情況進行控制(前端控制在2行)。