交互设计/UI设计/游戏设计/平面设计/视频后期处理/

“天气通”简单评测(设计方向)

 

功能模块
  1. 预报:
  2. 6天的天气预报与准确的实况天气信息,用户可以定制多个城市天气状况。
  3. 指数:
  4. 八大生活指数;紫外线、穿衣、感冒、舒适度、晾晒、洗车、运动和雨伞指数显示。
  5. 曲线:
  6. 5天温度曲线,直观知晓温度变化
  7. 周边:
  8. 查看周边天气;调入google地图,查看周边城市,轻松知晓所定位地区近3天天气
  9. 更多:
  10. 绑定微博号,定时通知提醒天气时节
  11.  
界面设计

天气通属于实用性应用程序,应该具有视觉上的吸引力,但是又能够突出它们显示的信息。实用型应用程序的用户界面十分简洁,并提供简单的,标准的视图和控件。

  1. 界面构架:
  2. 软件界面构架设计简单,主要由三部分组成:导航栏、视图内容、标签栏。
                      
    • 导航栏:
    • 导航栏通常会显示当前视图的标题,包含导航控件,并在适当的情况下也可以包含作用于视图内容的控件。导航栏有两种用途:激活应用程序中不同视图之间的导航;提供一些控件,用于管理视图中的条目。
    • 天气通的导航栏包含了标题、两个控件(分别控制了城市的切换和刷新)。

     

     

    状态栏:

    标签栏使用户能够在应用程序的不同模式或不同视图之间进行转换,并且用户应该能够从应用程序的任何地方进入这些模式。天气通的几大模块被集成在标签栏中进行便于用户在任何时候进行快捷切换。天气通的导航栏和标签栏的风格都为半透明风格,风格统一。

    1. 视图内容:
    2. 天气通的视图内容根据模块的不同而进行了不同的布局和内容组织。
    3. 预报模块:
    4. 上部分较大面积,将温度,天气,适度/风向,日期,分别以四种依次渐小的字体呈现。右下角排列了两个图标分别是特色功能:语音播报、天气分享。
    5. 界面下方用半透明框展示了连续6天的天气情况,每页呈现三天,下方设计了页指示符,提示用户可以进行左右滑动切换查看。
    6. 指数模块:
    1. 上部分娇小面积呈现了所选区域的日出/日落时间
    2. 下方较大面积用八大等距离区块展示了八大指数(图标+标题+内容说明)
    3. 曲线模块:
    4. 两条不同颜色气温走向曲线,直观显示连续五天气温变化
    5. 周边模块:
    6. 背景为google地图,其中标志出了主要区域标签,供用户点击查看。
    7. 当用户选择了周边某区域,标签栏上方呈现该区域连续三天的气温信息。半透明栏,与标签栏、状态栏保持了高度的一致。
    8. 更多:
    9. 点击进入了更多标签,使用了分组样式的表格视图进行展示。因为有不同组的不同信息,以及有的组有子视图。

    从上述界面元素分析我们可以看出,天气通的界面设计具有现代风格,以简约透明质感统一整个设计,界面元素设计较为严谨正规,遵循了IOS界面设计指南的说明。但是在遵循的同时仍有几点值得我们思考:

    1. “更多模块”的表单子表单的风格、色彩大相近庭
    2. 特色功能:语音播放和分享功能icon颜色过浅,不易发现。
    3. “更多模块”的分组不够科学,将“绑定微博号”和是否开启“周边地图”等放在了一组。
    交互设计

    喵骚用“交互设计的规范”等对天气通进行了交互设计上的探索。

    1. 点击交互提示:用户在点击导航、标签栏或者特定图标后,程序都会先高亮蓝色显示点击处,给用户提示点击,然后再进行反应。风格统一。
    2. 特色功能不够明显
    3. 导航栏的内容周围有三角提示切换指示,但用户点击三角符号却无反应,此时其实程序是将三角符号等同于页面指示符的作用了。设计不太符合用户习惯。
    4. 指数模块能简洁直观的反应八大指数,但在八大模块内Title和内容有些混淆,对齐方式不一,让用户阅读不便。将上放约1/3的内容留给了日出/日落的时间显示不够科学,试问除非是想早起看日出,准时看日落,有谁那么关心日出日落的时间呢?
    5. “周边模块”中,用户点击某周边模块后,标签栏上方出现连续三天的天气,程序将第一天的日期显示换成了所选区域名称,将地名和随后两天的日期进行了平行设计,不太符合用户阅读习惯。
    6. 以上是喵骚对《天气通》软件的初步评测,主要为了深入了解“IOS界面设计指南”和“交互几大原则”,纯学习目的。敬请拍砖。
    评论

    © 壹蜂窝 | Powered by LOFTER