随笔分类 - 系统分析与设计
摘要：1、描述需求。这时候需求可能不够具体，是一个笼统大概的状态。有时，就是几句话。2、把需求尽量细化、具体化，然后列出来。3、可视化需求。比如通过思维导图的方式把需求列举出来。4、梳理功能结构。把完整的功能结构列举出来，包括页面上的元素，甚至是交互流程。5、画原型。根据功能结构画原型。很多情况下，边调整...
阅读全文
摘要：本篇体验做一个简单圆角文本框，做到3个效果： 1、初始状态，圆角文本框有淡淡的背景色，边框的颜色为浅灰色2、点击圆角文本框，让其获取焦点，边框变成蓝色，背景色变成白色3、圆角文本框失去焦点，边框变成红色，背景色变成白色 从组成上分析，圆角文本框实际是由里层的Text Field和外层的Rectangle组成。 对于第一个状态，给Rectangle设置背景色和边框色，并且让Text ...
阅读全文
摘要：本篇实现注册页的一些功能。本项目是通过用户名和电子邮件进行注册的。 在本篇之前，在"使用Axure RP原型设计实践03,制作一个登录界面的原型"中已经对注册页做了基本的处理。 打开注册页，把登录页的提示动态面板放到当前注册页面提示的正下方，对齐。 提示的时候，有些提示只有一行，比如用户名没填，有些提示有2行，比如用户名和邮箱都没有填。可以把2个状态放到同一个动态面板中，给不同的状态命...
阅读全文
摘要：登录验证主要功能包括： ● 用户名错误，提示无效用户名，用户名和密码文本框清空● 用户名存在，密码错误，提示密码错误，密码清空，焦点进入密码框● 用户名和密码都正确，验证通过 本篇接着"使用Axure RP原型设计实践03,制作一个登录界面的原型"这篇。 创建一个页面，名称为"后台"，用来表示验证通过后的页面。 在实际项目中，需要把用户输入的用户名和密码与数据库中的相关匹配，可是，...
阅读全文
摘要：本篇体验公式的使用，一般出现值的时候就可以使用公式，公式可以使用全局变量也可以使用局部变量，在Axure中使用公司有一定的语法。 先创建2个全局变量。 向页面中拖入Rectangle部件，给它的OnClick事件编辑用例： 让其显示两个全局变量的和。注意：[[a]]+[[b]]这样写是不可以的。 [[]]里面可以进行计算，设置条件，还可以插入其它值。写在[[]]之外的都被当作是...
阅读全文
摘要：变量是一个可以变的数，可以看作是一个数据的容器。变量有2个操作，一个是读，一个是写。Axure的全局变量是指任何时候都可以对这个变量进行读写操作。 点击工具栏Project下的Global Variables，这里可以设置全局变量。 可以看到，默认已经有一个全局变量。还可以新建变量，变量是可以有默认值的。 现在自定义一个全局变量。 向页面中拖入一个Rectangle，设置R...
阅读全文
摘要：本篇体验做一个登录界面的原型。 登录页 首先在Page Style里为页面设置背景色。 如果想在页面中加图片，就把Image部件拖入页面，并设置x和y轴。双击页面中的Image部件可以导入图片。在Image部件对应的Widget Properties and Style面板中还提供了裁剪功能，裁剪完双击可保存图片。还提供了切割图片的功能。图片部件的Preserve Corners属性用...
阅读全文
摘要：本篇体验在Axure中自定义部件，并熟悉Widget Interations and Notes面板，Widget Properties and Style面板，Widget Manager面板。 在Axure中如何自定义部件Widget呢？ 点击"Widgets"面板中的"Options"下的"Create Library"，点击"完成"Axure随即启动打开一个Widget的编辑器，在...
阅读全文
摘要：首先认识Axure RP Pro 7.0软件的默认界面布局。最上面的是工具栏区域，左侧上方的是网站地图区域(sitemap)，左侧中部的是部件区域(Widgets)，左侧下方的是模板区域(Masters)，中间上方的是页面区域，中间下方的是页面设置区域，右侧上方是部件属性区域，右侧下方是动态面板区域。 依次点击"Publish","Preview"或直接按快捷键F5或直接按工具栏里的预览按...
阅读全文
摘要：当需要描述多个对象之间的互动，可以考虑使用序列图。 在建模项目下添加一个名称为"Basic Flow"的序列图。 比如描述客户是如何在MVC下获取到视图信息的。 备注： ● 通常是从用户的角度开始时序图的● 把粒度控制在必要的环节 参考资料：https://channel9.msdn.com/Blogs/clinted
阅读全文
摘要：如果想描述项目组件的关系，可以考虑使用UML组建图。 在建模项目下添加一个名称为"Applicaiton Component Structure"的UML组建图。 添加各个组件，并添加依赖关系。 在必要的时候，给组件添加备注。 如果想给依赖关系备注，需要在Name属性中设置。 可以为组件添加接口。 备注： ● 明确项目中的可执行程序和组件● 明确各个组件的依赖...
阅读全文
摘要：当需要描述项目的架构或技术栈的时候，可以考虑使用层关系图。 在解决方案下添加一个名称为"TailspinToys.DesignModel"的建模项目。 在新建的建模项目下添加一个名称为"Application Architect"的层关系图。 添加各个层，并添加依赖关系。 备注： ● 一个层表示一个职责● 尽量减少层之间的依赖关系 参考资料：https://cha...
阅读全文
摘要：当希望描述某个流程的时候，用活动图表示。 在项目中添加一个名称为"Shopping"的文件夹。 把"Orders Model"这个UML类图拖放到Shopping文件夹中。 先创建一个有关购物的活动图。 在Shopping文件夹下创建一个名称为"Browse Toys"的UML活动图。 把一个初始节点拖动到主界面，这个点表示活动开始的地方。 拖动若干个操作到界面上。 ...
阅读全文
摘要：右键解决方案，添加一个名称为"Domain Model"的UML类图。 首先站在整体的角度添加类，先不要任何属性。 添加Customer对Wishlist的关联，把"属性"中"Second Role"项中的"Is Navigable"设置为False。 添加Cusomter对Shopping Cart的关联，把"属性"中"Second Role"项中的"Is Navigabl...
阅读全文
摘要：在"在Visual Studio中使用用例图描述系统与参与者间的关系"中，使用用例图表示参与者与系统的关系，本篇体验参与者与用例(参与者要做的事情)的关系。 首先创建有关Customer参与者的UML用例图。 在解决方案下创建一个名称为"Customer"的UML用例图。 打开"UML模型资源管理器"，把其中的"Customer 参与者"拖动到右侧的主界面。 在主界面添加若干个用例...
阅读全文
摘要："用例图"用来描述谁用系统，用系统做什么。用例图不涉及使用细节，只用来描述使用人员和系统的关系，也不涉及行动的顺序。一起来体验。 使用Visual Studio 2012创建解决方案。 创建一个空白、名称为"TailspinToys"的解决方案。 右键解决方案，点击"添加","添加新项目"，选择左侧的"建模项目"，命名为"TailspinToys.AnalysisModel"。 ...
阅读全文
