1. 三欧吉Home
  2. 游戏资讯

知识积淀 | 基于IP与玩法设计用户界面

IP与玩法系统的结合设计—创建角色

以下的设计充分的还原了哈利波特的电影情节表现,并且通过有一定倾斜角度的书页形式尽量减少了UI弹出瞬间的打断感,沉浸感体验出色。


15.gif
电影场景

16.gif

17.gif

18.gif

19.gif
游戏界面

IP与玩法系统的结合设计—仪式体验


依然充分还原的电影的情节,并且在召唤扫把的时候给出了语音选项,加强沉浸感。


20.gif

21.gif
电影场景

22.gif

23.gif
游戏界面

IP与玩法系统的结合设计—图书馆抽卡

还原电影场景的前提下做了一些镜头感的处理,由一本魔法书来展开抽卡的环节,镜头感做的很扎实稳重。叠放的书页设计也在加强“从魔法书中获得力量”的概念。


24.jpg
电影场景

25.gif

26.gif

27.gif

28.gif

29.gif
游戏界面

对比介绍—幻书启示录的图书馆抽卡镜头感

同为“抽书概念”的幻书启示录,抽卡系统的镜头感做的十足,并且近景远景的切换也做了许多层次。

对比哈利波特确实炫酷了很多,但基于IP的设计要符合世界观的设定,哈利波特中魔法是朴实且古老的,所以对于镜头感的设计必须要进行一定的取舍,一切设计基于IP,一切设计贴合IP。

30.gif

31.gif

32.gif
幻书启示录游戏界面

对比介绍—镜头感带来的视觉冲击

以下是一些对于镜头感捕捉的动图展示,好的镜头感使得视觉UI层级的设计更为贴合游戏本身的设定,降低UI层级对游戏体验的打断感觉,并且在特定的重要情节起到推进烘托作用,加强整个游戏的沉浸体验感。


33.gif

34.gif

35.gif

36.gif

37.gif

38.gif
镜头感动图

《永远的七日之都》切换角色的设计给人的感觉就不是人物之间的简单平滑过渡,给人的视觉冲击要强很多。

39.gif
《永远的七日之都》游戏界面



IP与玩法系统的结合设计—战斗系统

在首次战斗系统中,也是加强的仪式感的体验,以及对电影情节的高度还原。


40.jpg
电影场景

41.gif

42.gif

43.gif

44.gif
游戏界面

IP与玩法系统的结合设计—成就指引

成就系统中,也是引用了大厅中的壁画元素作为指引的看板娘,而非自创的不相关立绘。


45.gif
电影场景

46.gif

47.gif

创新设计点—如何定义内容的边界

在UI的视觉层级中,始终有着边界感这个限制要素,有利有弊,一方面可以强化信息层级的关联性,另一方面边界的限制对游戏的沉浸体验感打断极强。


48.gif

49.gif

50.gif
游戏界面

上图为一些有趣的小设计,边界感是否可以通过一些符合游戏特性的元素来打破,欢迎阐述各位的观点~



来源:游族UEDC
地址:https://mp.weixin.qq.com/s/Rsi98z876lOX4airqvDEow

原创文章,作者:,如若转载,请注明出处:https://www.3og.cn/47992.html

Contact Us

400-800-8888

在线咨询:点击这里给我发消息

邮件:uxgecn@qq.com

工作时间:周一至周五