xd设计的原型图能否导出html格式,XD-餐饮app原型设计与代码导出
1、本课主要是讲餐饮APP原型版面设计,【打开】Adobe XD软件,【打开】案例所需要的素材文档。具体显示如图示。2、【新建】画板,【重命名】画板。单击【外观属性面板】,单击【填充】-【渐变填充】,根据设计思路选择定义的渐变颜色。具体显示如图示。3、【拖入】箭头元素,排列至左侧距离顶部40PX,左侧20PX距离的位置。【拖入】图标素材,调整宽度大小为20PX,使用【文字工具】,输入店铺名称,调整
·
1、本课主要是讲餐饮APP原型版面设计,【打开】Adobe XD软件,【打开】案例所需要的素材文档。具体显示如图示。
2、【新建】画板,【重命名】画板。单击【外观属性面板】,单击【填充】-【渐变填充】,根据设计思路选择定义的渐变颜色。具体显示如图示。
3、【拖入】箭头元素,排列至左侧距离顶部40PX,左侧20PX距离的位置。【拖入】图标素材,调整宽度大小为20PX,使用【文字工具】,输入店铺名称,调整大小和颜色,选择合适的字体,排列至图标右侧合适的位置。具体效果如图示。
4、调整文字大小和位置细节,按Alt键【拖动复制】文字至合适的位置,使用【文字工具】输入地址文字信息,调整大小和位置细节。【选择】文字关联元素,按【Ctrl+G】编组,移动至顶层中间位置。具体效果如图示。
5、使用【矩形工具】绘制合适大小的矩形,【水平居中】,单击【圆角半径】12PX,【填充】红色,【不透明度】50%。具体效果如图示。
6、【拖入】圆圈符号,【不透明】50%,右击【取消编组】,椭圆【半径】60PX,移动至圆角矩形上方顶部和左侧各20PX距离。具体效果如图示。
更多推荐
已为社区贡献3条内容
所有评论(0)