用xcode做设计，其实没啥不可以的，在此我只是演示下很简单的操作，不要运用什么程序就可以完成最基本的交互设计，简单节约时间，升至程序猿可以直接通过这个加程序后制作界面！

第一步打开xcode

选择 single view application

注意语言选择 swift 别的可以随便写！

打开后选择main.storyboard ，右边会出来一个页面，有人问为啥是方的，呵呵，自动布局就是如此，习惯就好我会在后面说明，就是要在方的画板上做设计！

拖一个imgeview，撑满画面

从桌面拖一张背景图！尺寸在1200x1200左右便可，放在2x（这是入门教程，你可以不需要知道为什么照做就好）

选择imageview然后选择放入图片

选择自动布局，设置居中画面，设置等比例缩放，设置宽度600锁定，设定上下锁边！如此画面在各种机型下就不会变形啦

所见即所得，可以设置右边看到你调整后不同机型的平面变化，非常的方便

对你们没有看错，毛玻璃效果只是个控件，非常方便嘿嘿，运行下看看吧（记得 alpha调整到0.4)

点击运行，就会弹出模拟器窗口，记得多选几个机型！你会发现会自动调整布局

接下来和前面一样，可以运用sketch或者ps画一个圈输出图片放在2x上

选中圈拖到画面上

这边有点小复杂，首先左边是图层关系，所以圈是需要在最下方图层（最下方就是最上方显示，和ps是相反的），其次自动布局

样式可以参考右边参数，注意view和shape都需要布局

调整字体大小，再拖入一个lable

 自动布局参数

这部分可以看下之前的自动布局我就不再演示一遍了参数右边有

好了开始做登录和注册的按钮拉一个button

再复制一个按钮，参数可按照右边随意修改

设置锁2边，2个按钮都是如此设置

设置自动布局参考右边参数

注册按钮设置

设置2个按钮圆角，点击＋号添加

呵呵好了app启动页基本完成！不难吧：）

好啦开始做第2个页面新建一个页面

按住control后拖拽到新页面，按钮就可以链接到新页面啦

好了后面的部分我会再第2部分介绍，大家也可以来QQ群找我：421771474!

最后放下链接效果吧！