用简单的方法做整套UI(教程第一/二/三弹合集)

gee引擎修改UI界面图文教程 很多客户在搭建GOM引擎或者GEE的引擎的时候需要读取皮肤文件,但是皮肤有logo或者网址需要替换图片的话就需要下面这个教程了。很多客户在搭建GOM引擎或者GEE的引擎的时候需要读取皮肤文件,但是皮肤有logo或者网址需要替换图片的话就需要下面这个教程了。2、打开GEE登录器皮肤编辑对话框之后点击打开我们想要修改的皮肤文件.geeskin。好图片之后再点击load...按钮讲修改好的图片导入进来,点击OK框,好图片之后再点击load...按钮讲修改好的图片导入进来,点击OK框,... 阅读详情

http://bbs.66rpg.com/thread-329530-1-1.html

http://v.tieba.baidu.com/p/2985559487

首先要准备两个工具,“美图秀秀”(咦~我说的是“美图”),然后是“PS”(玉酱用的PS5)
其实不要觉得工具多啊,玉酱我有5个图片编辑工具哦,(泥垢···)
如果没有PS的朋友,也可以直接用美图秀秀解决。
新手完全可以自己制作出来的一套UI。
以前作品链接:美图秀秀第一弹
(事实证明       美图秀秀第二弹
如果用心也       PS+美图秀秀混合第三弹
可以自己做       PS+美图秀秀混合第四弹(附带游戏效果!)
好的)              纯PS制作-古风、仙侠(2013-10-11发布)

教程续作:        用最简单的方法做套UI(教程第二弹)链接地址(此楼341层)
                         第一弹:音量条的补充(此楼347楼)



那么今天我先写一个 纯秀秀(无PS) 的制作教程。
教程1,只用美图秀秀做出来的(范例为粉红可爱风-适合现代乙女游戏)
抱歉,因为不知道要不要做第二弹,所以这样设置了下“回复可见”,如果效果好,我会去继续做第二弹,第三弹等等。(玉酱现在都还在不断努力学习,所以请见谅)
而且不设置的话图片很多,会卡的。【泥垢,借口···

 
语言栏:
1,·现在橙光中新建一个你要做的游戏,然后打开UI文件夹,这样方便你看到要做多大才合适。玉酱我是万年800-600的比例,所以就以这个比例来做范文。图1

2·打开秀秀。新建透明图层(若不喜欢半透明,可以设置自己喜欢的背景!)。(这里玉酱建议稍微比原有UI框大10-30的样子)。图2

3·在饰品-炫彩水印处找到你喜欢的颜色,美图原设是3个颜色-粉,黄,蓝。(玉酱用粉色)图3

4·在边框-简单边框选择你喜欢的框子。(玉酱找了个粉红色来搭配底色)图4

5·可以确定后返回饰品处,添加一些你喜爱的装饰。也可以就简单素雅的。图5

6·微调之后,保存-格式要是PNG啊!



 
姓名栏:
和语言栏同,忽略···(玉酱建议姓名栏不宜太花哨,简单为好)图6

CG按钮·存档按钮:
也和语言栏做法相同,不详细说明了。(注:这两个按钮不能为透明边框,不然网页版只能点击那条线,点空白处没用!)



 
其余文字按钮们:
1·打开button文件夹,找到你想替换的按钮,然后找到尺寸大小,同语言栏1·2相同。图7

2·文字形式的可以有背景、边框,也可以不用背景、边框。然后找到“文字”-“静态文字输入”写上你想写的字(字体,大小,高级可根据自己喜欢设定)。图8

3·保存,同样PNG格式啊···啊···啊····
4·点中之后的按钮做法,可以吧阴影色和底色呼唤(这是最简单的),也可以自己重新设置颜色,或者添加阴影或者横线。图9

5·保存,PNG格式。然后大功告成!





范例图片在二楼,大家可以看了喜不喜欢再回复。CG,BGM,存档,剧情回放,设置等,在第二弹出。


此为范例试验品,喜欢的可以拿去随便修改。
谢谢喜欢。╮(╯▽╰)╭玉酱爱你!




你看看,这样做了行不行。新建一个语言栏那么大小的框。透明或者不透明。然后在左键点边框。

·1.png (149.39 KB, 下载次数: 88)

·1.png



啊那个是我疏忽了一点,忘了音量条比较特殊。
选择框和语言栏做法相同,所以就不单独列出,下面要讲的是音量条的做法。
首先声明一点,这个做法玉酱觉得很捉急啊(其他办法有待研究)····



 
1·打开美图秀秀,新建-大小自己定。玉酱就用。374-20的标准大小示范一下。点击图示“涂鸦笔”图1


2·选择你喜欢的类型进行填充,可以单色,可以花色。玉酱用花色,处理好后“确定”。图2


3·回到图一处看,左上角有个“裁剪”,点击进入。可拖动进度条大小,以及是否圆角,个人觉得圆角是必须的,不然方方正正丑死了啊喂···图3


4·选好之后点保存,存为PNG!!不然你的圆角就变成白色了哦。

备注,音乐条为两个,第二个可以用其他效果处理一下就行了,比如柔光,lomo,如果是单色的话也可以用另一种颜色取代。

好了。第三弹的补充到这里。


效果图在二楼。一共四个,两个花色,两个单色。






  (用的复古效果)




噢·不···其实我居然花了将近一天的时间做这3个教程,我的彩虹都还没更新,对不起要开学的琳子小姐还有空城妹妹了。。。  ← 啊喂,这个不是音量条啊。。


搬运第二章过来。
接下来继续谈论关于BGM,CG,存档,剧情回放那几个图片的处理。


1·找到几张尺寸比例正确的图(就是说你做多大的分辨率就用多大的图片,不正确的请先修改了再加工),这里玉酱建议最好是用画风差不多的,免得有违和感。那玉酱在这里,还是用的800-600的来范例。【我是800-600狂啊···
注:如果要纯原创的话,请期待玉酱之后推出的PS混搭版。谢谢!
2·把图片拖到“美图秀秀”中。如果要“边框”的可以先选定边框,然后用“饰品”找到开始我们看到那块“粉红色”(或者你喜欢的其他),点击,可以拉伸,调到自己喜欢的大小即可。玉酱建议别太大(一会要放字体),也别太小(橙光系统设置时不好设置)。
3·点击“文字”-“静态文字”-选择自己喜欢的字体和大小以及颜色。玉酱这里建议一下,字体不宜过大过小,都不好看,800-600的话大概在60-80大小就差不多了,大于80就太大。小于60了没存在感···
细节:
(1)音乐鉴赏处建议留点位置,如果要在橙光里放专辑图片的话那个位置必须留下。(范例在“音”字下面那里空白处。)图1







(2)图片鉴赏的选框稍微弄大点,因为图片比较暂地方。图2 






(3)剧情回放的选框依然要大点,毕竟文字多了如果选框小的话会很丑,大点没错的。图3






(4)存档处也尽力弄大一点。都是为了橙光系统设置那里好设置。图4






(5)最后就是“设置”画面了,首先设置界面不适合用框框,所以我们先要在“美化”里面选择一项属性(如柔光,lomo等效果来处理一下背景)这里玉酱用的“致青春”效果。然后就是这个字也比较多,但是一定要统一一下字体和大小。比如标题都是80的话,小字就是40-60.玉酱个人偏爱60.好记。然后就是排版,根据自己喜欢,间距最好要统一,这样才美观。我截图都有字数大小,可供参考。图5






4·在橙光中的设置问题
先打开橙光找到“系统设置”-然后挨着去一个一个调动就行了。这一步需要一点耐心。
(2)这里提醒一点,黄色框不能超过我们设置的框框,不然字或者图会出现在框外,很丑。图6







(3)就是记得保存= =。【废话了啊···

5·好吧,第二章教程就到这里了。下次准备来个PS+美图秀秀的混搭版。效果图一如既往的上在2楼。


   效果图:http://bbs.66rpg.com/thread-329579-1-1.html


H-ui整套后台管理 整套的H-ui后台管理系统模板,可以直接套用,简单便利,功能齐全 立即下载

相关推荐

500pi-GOM引擎更换全套UI教程.exe

500pi-GOM引擎更换全套UI教程.exe

GEE引擎传奇UI界面修改教程

传奇根目录指向的是你的传奇客户端根目录,如果是要自定义素材,将素材放入补丁文件夹,然后将NewUI1.PAK、NewUI2.PAK、NewUI3.PAK、NewUI4.PAK、NewUI5.PAK文件分别对应好,输入正确的密码后点保存配置,保存后。UI素材有多种格式的,.pak/.wil/.wis...之前给你们分享了pak编辑器,今天给你们分享一个wil/wis真彩编辑器,不管是什么引擎的素材都是可以打开的。在客户端界面设置这里可以自定义UI素材,也可以直接在原素材上编辑主界面。

用最简单的方式说最重要的事!服务器、存储、云计 算、A智能的大数据产品、游戏开发技术。致力于广 大开发者、政企用户、各项机构等,构建云上世界提供全方位云计算解决方案。旨在打造差异化的开放式闭环生态系统帮助用户快速构建稳定、安全的云计算环境。 1万+

一套完整的UI界面charisma-ui

一套完整的UI界面charisma-ui

Cocos学习之UI系统基础

本文系统解析Cocos Creator UI开发体系,从Canvas多分辨率适配原理到Widget对齐机制,详解Label/Button/Sprite等五大基础组件特性。通过三个典型案例实战:①交互按钮实现背景变色与点击计数,演示组件通信与事件监听;②Layout组件构建自适应技能栏,展现动态排列技巧;③EditBox输入实时反馈,剖析事件驱动开发模式。附常见问题解决方案,总结画布适配、组件化开发、自动布局三大核心要素,为开发者提供从基础到进阶的UI开发实践指南,助力构建高效美观的游戏界面。

tipsyes的博客 1245

web UI,网站后台ui 8种,全套

8套,不同的web后台UI,全套

优美的UI框架一套

优美的UI框架一套,每个页面都是单独的一个样式,可独立使用

ShoeBox一个超级好用的图片切割工具

ShoeBox一个超级好用的图片切割工具 两款图片切割工具 ShoeBox:http://renderhjs.net/shoebox/ BigShear:https://www.fancynode.com.cn/bigshear 下面试下ShoeBox。ShoeBox是一个图片处理软件,体积很小。 我主要用第三个功能拆开图片。根据大图上的小图空白间隙来处理的。 导出后变成很多小图 ...

优秀技术文章收录 1959

WEUI整套移动端模板源码

WEUI整套移动端模板源码WEUI整套移动端模板源码WEUI整套移动端模板源码

从此不求人:自主研发一套PHP前端开发框架

本课程把我们公司团队的自主研发一套PHP开发框架进行简化和适应性修改后,奉献给大家。并从思路、设计、编码和部署测试每个过程给大家详细讲解。框架纯实战级,实用、简单、暴力。并支持插件化开发,功能还支持微信开发集成。课程学完后,整个课件源代码就是一个完整的中型web前端开发框架。大家可以任意复制、学习、修改或占为己有

收藏许久的一套UI框架

一套泰克学院讲解的UI框架,内涵视频与整个代码!!!

weui开发的一整套移动端商城

weui开发的一完整手机移动端商城购物平台整站html模板源码下载,包括首页,购物车,订单管理,评价,分类,会员中心等,全面到注册协议都弄好了。

后台ui大全(有这些你就够了)

做过后台开发的都知道,我们后台ui基本上都是去拖一个现成的ui框架,然后我们在此基础上改改就差不多了,那该如何选择合适的后台ui呢,哥们那你走运了,我最近整理了最近用的比较多的后台ui,希望有你喜欢的一款。(后面有下载链接) 一,前言 我想大部分人都用过EasyUI吧,一切都好,但感觉有点土了,想换成现在流行的Bootstrap为基础的后台UI风格,想满足的条件应该达到如下几个: ...

蓝星花 4万+

一个微店的所有ui页面

从github上找的一个微店全套代码。。。。又要凑字数。。。。。。。

UI教你怎么制作PSD图

UI教你怎么制作PSD图

Bright2017的博客 4159

漂亮的个人博客界面

简单的修改下就可以做个人的blog了,这个挺不错的

滤波算法-呼吸心跳信号检测方法(四)

呼吸心跳信号检测系列文章:信号滤波处理

yjh_2019的博客 6269

自己项目中做的UI布局

一丶先看效果图

pengruiyu1的博客 448

基于IP2369与STM32的45W双向PD移动电源设计

USB PD(Power Delivery)是一种面向高功率、智能协商的通用快充协议,其核心在于通过BMC编码在CC线上完成供电能力(PDO)动态匹配与电压/电流精准调控。IP2369作为高度集成的PD协议管理芯片,内置PHY、协议引擎与MOSFET驱动,可卸载MCU实时通信压力;而STM32F103系列凭借低功耗STOP模式与丰富外设,成为电源状态管理与用户交互的理想协处理器。该组合显著提升系统鲁棒性与能效比,适用于便携式移动电源、嵌入式备用电源及PD协议教学验证等场景。本文围绕IP2369配置电阻精度、

weixin_42608299的博客 516

Cocos Creator教程 ——(二)UI系统介绍(上)

目录前言一、Sprite(精灵)二、Label(文字)三、Weight(对齐挂件)四、Layout(自动布局) 前言 这里会通过一个demo项目去介绍现在的UI系统有生产什么游戏的能力,以及在制作UI的过程中的各种实现细节;Cocos Creator实现了彻底的脚本化、组件化以及数据驱动的特点,还有一个好用的UI系统,现在我们看一个UI的demo;由于视频作者没有提供源代码素材,所以这里只能简单进行素材的替换并进行演示。所有的UI界面的生成都是由UI元素拼装而成,我们会这里会分别介绍Sprite精灵,Lab

然后就去远行 3143

专有钉钉小程序(浙政钉)开发搭建流程总览

最近公司有一个项目要做浙政钉,让我来负责做。靠,我一脸懵,开发了两年多不知道浙政钉是啥,感觉我眼界还是低了。然后就去百度、同事问了一圈才知道就是个钉钉小程序嘛,然后发布到浙政钉上了。就搭建项目跑起来我都肥了很多事,中间走了很多坑。正好领导让我写《钉钉小程序前端开发流程》,这想着也写个博客吧。下面就是整个流程及我所遇到的坑!

m0_53910290的博客 6356

手把手教你用Arduino Uno控制meArm机械臂(附完整代码+避坑指南)

本文提供了一份详尽的meArm机械臂控制指南,涵盖从Arduino Uno硬件连接到Servo库编程的完整流程。重点讲解了如何通过独立供电、软件限位和平滑运动函数实现稳定控制,并设计了串口指令协议与高级功能,帮助创客有效规避舵机抖动、电源不足等常见问题,让机械臂运行更流畅可靠。

gpt4scribbler的博客 541

实现一套自己的ui-1

版本:2.x 目标:基于cocos2dx底层实现一个自己简单的一套的ui,改屏幕坐标原点为右上角。 首先我们通过继承CCNodeRGBA来实现自己的基类,为什么要继承CCNodeRGBA而不是CCNode,因为CCNodeRGBA有对node的颜色与透明度的设置 #pragma once #include "cocos2d.h" class View:public cocos2d::CC

图图 1550

ClaudeCode入门01-环境安装(小白入门:手把手教你配置,超简单的一种接入方式)

文手把手教你从零搭建 Claude Code 开发环境。针对国内网络现状,我们采用 OpenRouter + Claude Code Router 的方案,支持支付宝/微信充值,无需科学上网即可完成配置。内容涵盖 Node.js 安装(macOS/Windows/Linux)、OpenRouter 注册与充值、Claude Code 和 Router 安装配置,以及一键启动脚本的编写。跟着截图一步步操作,10分钟搞定全部环境!

yueyeguzhuo的专栏 280
上一篇: UGUI与NGUI优缺点对比
下一篇: 解决粒子特效被NGUI遮挡的问题
chenluwolf
博客等级 码龄20年 85粉丝 5原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值