软件工程实验：原型设计

前言

本次实验的主题是原型设计，即根据用户需求和系统功能，设计一个简单的软件原型，展示系统的界面和交互方式。原型设计是软件工程中的一种重要技术，它可以帮助开发者和用户沟通和理解，验证和改进需求，提高软件质量和用户满意度。

实验目的

通过实验，熟悉并掌握使用Axure绘制系统原型

实验要求

仿照U+新工科智慧云绘制系统原型，完成2～4个原型页面设计，并尝试生成HTML代码。

实验过程

系统原型

也就是说要仿照这个进行绘制

绘制

使用软件axure绘 制 原 型 图

在软件中根据需要拖选模块进行搭配
基础的标题图片等就不多赘述了，在此描述一个点击图片就可以变换的效果
在添加图片后

效果如下

在点击了图片之后

这就实现了这样的效果
再展示一个轮播图的效果，在插入图片后，进行这样的设置

就实现了一个轮播图的效果

登录界面
可以根据输入的账号密码决定是否成功登录

如图所示设置提交按钮就可以实现

生成html代码

通过软件生成html文件

< ! D O C T Y P E ht m l >
< ht m l >
 < h e a d >
 < t i t l e > i n d ex < / t i t l e >
 < m et a h tt p - e q u i v = " X-UA-C o m p at i b l e " 
c o n te n t = " IE = e d ge " / >
 < m et a h tt p - e q u i v = " c o nt e nt-t y p e " co n te n t = " tex t / h t m l ; 
c h a rs e t = u t f-8 " / >
 < m et a n a m e = " a p p l e -m o b i l e -we b -a p p - ca p a b l e " 
c o n te n t = " ye s " / >
 < l i n k h ref = " re s o u rc e s /c s s / j q u e r y -u i-t h e m e s . c s s " 
t y p e = " tex t /c s s " re l = " s t y l e s h e et " / >
 < l i n k h ref = " re s o u rc e s /c s s /axu r e _ rp _ p a ge . c s s " 
t y p e = " tex t /c s s " re l = " s t y l e s h e et " / >
 < l i n k h ref = " d ata /st y l e s .c s s " t y p e = " t ex t /c s s " 
re l = " st y l e s h e e t " / >
 < l i n k h ref = " f i l e s / i n d ex /s t y l e s . c s s " t y p e = " t ex t /c s s " 
re l = " st y l e s h e e t " / >
 < s c r i pt s rc = " re s o u rc e s /s c ri p t s / j q u e r y -
1 .7 .1 . m i n . j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c ri p t s / j q u e r y -u i1 .8 .1 0 .c u s to m . m i n . j s " > < /s c ri pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /a x Q u e r y. j s " > < /s c ri pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /g l o b a l s . j s " > < /s c ri pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu t i l s .j s " > < /s c ri pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /a n n o ta t i o n .j s " > < /s c ri p t >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /a x Q u e r y. std .j s " > < /s c ri p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / d o c .j s " > < /s c r i pt >
 < s c r i pt s rc = " d ata / d o c u m e nt .j s " > < /s c r i p t >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s / m e s s a g e c e nte r. j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /ev e nt s . j s " > < /s c r i pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / re co rd i n g .j s " > < /s c ri pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /a c t i o n . j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /ex p r.j s " > < /s c r i pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /g e o m et r y.j s " > < /s c ri p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / f l yo u t .j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / i e . j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / m o d e l .j s " > < /s c r i pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / re p e a te r. j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /st o . j s " > < /s c r i pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / u t i l s .te m p .j s " > < /s c ri pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / va ri a b l e s . j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / d ra g . j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / m o ve . j s " > < /s c ri pt >
 < s c r i pt 
s rc = " res o u rc e s /s c ri p t s /a xu re / v i s i b i l i t y. j s " > < /s c ri pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /st y l e . j s " > < /s c ri pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /a d a p t i ve . j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / t re e . j s " > < /s c r i pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / i n i t .te m p .j s " > < /s c ri pt >
 < s c r i pt s rc = " f i l e s / i n d ex / d at a . j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / l e ga c y.j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / v i e we r. j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / m a t h . j s " > < /s c ri pt >
 < s c r i pt t y p e = " tex t / j ava s c r i pt " >
 $ a xu re .u t i l s . g et Tra n s p a re n t G i f Pa t h = f u n c t i o n ( ) { re t u rn 
' re s o u rc e s / i m a ge s / t ra n s p a re n t . g i f ' ; } ;
 $ a xu re .u t i l s . g et O t h e r Pa t h = f u n c t i o n ( ) { ret u rn 
' re s o u rc e s / O t h e r.ht m l ' ; } ;
 $ a xu re .u t i l s . g et Re l o a d Pat h = f u n c t i o n ( ) { ret u r n 
' re s o u rc e s / re l o a d .h t m l ' ; } ;
 < /s c r i p t >
 < / h e a d >
 < b o d y >
 < d i v i d = " b a s e " c l a s s = " " >
 < !- - U n n a m e d (矩 形 ) - ->
 < d i v i d = " u 0 " c l a s s = " ax _ d efa u l t b ox _ 1 " >
 < d i v i d = " u 0 _ d i v " c l a s s = " " > < / d i v >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 1 " c l a s s = " tex t " st y l e = " d i s p l ay : n o n e ; 
v i s i b i l i t y : h i d d e n " >
 < p > < s p a n > < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - U n n a m e d (矩 形 ) - ->
 < d i v i d = " u 2 " c l a s s = " ax _ d efa u l t _一 级 标 题 " >
 < d i v i d = " u 2 _ d i v " c l a s s = " " > < / d i v >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 3 " c l a s s = " t ex t " s t y l e = " v i s i b i l i t y : v i s i b l e ; " >
 < p > < s p a n >一 眼 丁 真 新 芝 士 雪 豹 云 < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - U n n a m e d (矩 形 ) - ->
 < d i v i d = " u 4 " c l a s s = " ax _ d efa u l t _三 级 标 题 " >
 < d i v i d = " u 4 _ d i v " c l a s s = " " > < / d i v >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 5 " c l a s s = " t ex t " s t y l e = " v i s i b i l i t y : v i s i b l e ; " >
 < p > < s p a n >一 眼 丁 真 鉴 定 为 真 < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - U n n a m e d (矩 形 ) - ->
 < d i v i d = " u 6 " c l a s s = " ax _ d efa u l t l i n k_ b u tto n " >
 < d i v i d = " u 6 _ d i v " c l a s s = " " > < / d i v >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 7 " c l a s s = " t ex t " s t y l e = " v i s i b i l i t y : v i s i b l e ; " >
 < p > < s p a n >登 录 注 册 < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - U n n a m e d (图 片 ) - ->
 < d i v i d = " u 8 " c l a s s = " ax _ d efa u l t i m a ge " >
 < i m g i d = " u 8 _ i m g " c l a s s = " i m g " 
s rc = " i m a ge s / i n d ex / u 8 .p n g " / >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 9 " c l a s s = " tex t " st y l e = " d i s p l ay : n o n e ; 
v i s i b i l i t y : h i d d e n " >
 < p > < s p a n > < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - U n n a m e d (图 片 ) - ->
 < d i v i d = " u 1 0 " c l a s s = " ax _ d efa u l t i m a g e " >
 < i m g i d = " u 1 0 _ i m g " c l a s s = " i m g " 
s rc = " i m a ge s / i n d ex / u 1 0 . p n g " / >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 1 1 " c l a s s = " tex t " s t y l e = " d i s p l ay : n o n e ; 
v i s i b i l i t y : h i d d e n " >
 < p > < s p a n > < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < / d i v >
 < / b o d y >
< / h t m l >
< ! D O C T Y P E ht m l >
< ht m l >
 < h e a d >
 < t i t l e > p a g e 1 < / t i t l e >
 < m et a h tt p - e q u i v = " X-UA-C o m p at i b l e " 
c o n te n t = " IE = e d ge " / >
 < m et a h tt p - e q u i v = " c o nt e nt-t y p e " co n te n t = " tex t / h t m l ; 
c h a rs e t = u t f-8 " / >
 < m et a n a m e = " a p p l e -m o b i l e -we b -a p p - ca p a b l e " 
c o n te n t = " ye s " / >
 < l i n k h ref = " re s o u rc e s /c s s / j q u e r y -u i-t h e m e s . c s s " 
t y p e = " tex t /c s s " re l = " s t y l e s h e et " / >
 < l i n k h ref = " re s o u rc e s /c s s /axu r e _ rp _ p a ge . c s s " 
t y p e = " tex t /c s s " re l = " s t y l e s h e et " / >
 < l i n k h ref = " d ata /st y l e s .c s s " t y p e = " t ex t /c s s " 
re l = " st y l e s h e e t " / >
 < l i n k h ref = " f i l e s / p a ge 1 /s t y l e s . c s s " t y p e = " tex t /c s s " 
re l = " st y l e s h e e t " / >
 < s c r i pt s rc = " re s o u rc e s /s c ri p t s / j q u e r y -
1 .7 .1 . m i n . j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c ri p t s / j q u e r y -u i1 .8 .1 0 .c u s to m . m i n . j s " > < /s c ri pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /a x Q u e r y. j s " > < /s c ri pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /g l o b a l s . j s " > < /s c ri pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu t i l s .j s " > < /s c ri pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /a n n o ta t i o n .j s " > < /s c ri p t >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /a x Q u e r y. std .j s " > < /s c ri p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / d o c .j s " > < /s c r i pt >
 < s c r i pt s rc = " d ata / d o c u m e nt .j s " > < /s c r i p t >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s / m e s s a g e c e nte r. j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /ev e nt s . j s " > < /s c r i pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / re co rd i n g .j s " > < /s c ri pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /a c t i o n . j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /ex p r.j s " > < /s c r i pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /g e o m et r y.j s " > < /s c ri p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / f l yo u t .j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / i e . j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / m o d e l .j s " > < /s c r i pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / re p e a te r. j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /st o . j s " > < /s c r i pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / u t i l s .te m p .j s " > < /s c ri pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s/a xu re / va ri a b l e s . j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / d ra g . j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / m o ve . j s " > < /s c ri pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / v i s i b i l i t y. j s " > < /s c ri pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re /st y l e . j s " > < /s c ri pt >
 < s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re /a d a p t i ve . j s " > < /s c r i p t >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / t re e . j s " > < /s c r i pt >
 <s c r i pt 
s rc = " re s o u rc e s /s c ri p t s /a xu re / i n i t .te m p .j s " > < /s c ri pt >
 < s c r i pt s rc = " f i l e s / p a ge 1 / d ata . j s " > < /s c ri pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / l e ga c y.j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / v i e we r. j s " > < /s c r i pt >
 < s c r i pt s rc = " re s o u rc e s /s c r i pt s /a xu re / m at h . j s " > < /s c ri pt >
 < s c r i pt t y p e = " tex t / j ava s c r i pt " >
 $ a xu re .u t i l s . g et Tra n s p a re n t G i f Pa t h = f u n c t i o n ( ) { re t u rn 
' re s o u rc e s / i m a ge s / t ra n s p a re n t . g i f ' ; } ;
 $ a xu re .u t i l s . g et O t h e r Pa t h = f u n c t i o n ( ) { ret u rn 
' re s o u rc e s / O t h e r.ht m l ' ; } ;
 $ a xu re .u t i l s . g et Re l o a d Pat h = f u n c t i o n ( ) { ret u r n 
' re s o u rc e s / re l o a d .h t m l ' ; } ;
 < /s c r i p t >
 < / h e a d >
 < b o d y >
 < d i v i d = " b a s e " c l a s s = " " >
 < !- - 轮 播 图 (动态面板 ) - ->
 < d i v i d = " u 1 2 " c l a s s = " ax _ d efa u l t " d at a -l a b e l = "轮 播 图 " >
 < d i v i d = " u 1 2 _ st ate 0 " c l a s s = " p a n e l _ stat e " d at a -
l a b e l = " S ta te 1 " >
 < d i v i d = " u 1 2 _ stat e 0 _ c o n te n t " 
c l a s s = " p a n e l _ stat e _ c o nte nt " >
 < / d i v >
 < / d i v >
 < d i v i d = " u 1 2 _ st ate 1 " c l a s s = " p a n e l _ stat e " d at a -
l a b e l = " S ta te 2 " >
 < d i v i d = " u 1 2 _ stat e 1 _ c o n te n t " 
c l a s s= " p a n e l _ stat e _ c o nte nt " >
 < / d i v >
 < / d i v >
 < / d i v >
 < !- - U n n a m e d (矩 形 ) - ->
 < d i v i d = " u 1 3 " c l a s s = " ax _ d efa u l t _一级标题 " >
 < d i v i d = " u 1 3 _ d i v " c l a s s = " " > < / d i v >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 1 4 " c l a s s = " t ex t " st y l e = " v i s i b i l i t y : 
v i s i b l e ; " >
 < p > < s p a n >新 芝 士 雪 豹 云 < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - U n n a m e d (矩 形 ) - ->
 < d i v i d = " u 1 5 " c l a s s = " ax _ d efa u l t p r i m a r y _ b u tto n " >
 < d i v i d = " u 1 5 _ d i v " c l a s s = " " > < / d i v >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 1 6 " c l a s s = " t ex t " st y l e = " v i s i b i l i t y : 
v i s i b l e ; " >
 < p > < s p a n >短 信 登 录 < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - U n n a m e d (矩 形 ) - ->
 < d i v i d = " u 1 7 " c l a s s = " ax _ d efa u l t p r i m a r y _ b u tto n " >
 < d i v i d = " u 1 7 _ d i v " c l a s s = " " > < / d i v >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 1 8 " c l a s s = " t ex t " st y l e = " v i s i b i l i t y : 
v i s i b l e ; " >
 < p > < s p a n >密 码 登 录 < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - 账 号 (文 本 框 ) - ->
 < d i v i d = " u 1 9 " c l a s s = " a x _ d efa u l t b ox _ 1 " d ata -l a b e l = "账
号 " >
 < i n p u t i d = " u 1 9 _ i n p u t " t y p e = " t ex t " va l u e = " " / >
 < / d i v >
 < !- - 账 号 (文 本 框 ) [ fo o t n o t e ] - ->
 < d i v i d = " u 1 9 _ a n n " c l a s s = " a n n o ta t i o n " > < / d i v >
 < !- - 密 码 (文 本 框 ) - ->
 < d i v i d = " u 2 0 " c l a s s = " a x _ d efa u l t t ex t _ f i e l d " d ata -
l a b e l = "密 码 " >
 < i n p u t i d = " u 2 0 _ i n p u t " t y p e = " p a s s wo rd " va l u e = " " / >
 < / d i v >
 < !- - 密 码 (文 本 框 ) [ fo o t n o t e ] - ->
 < d i v i d = " u 2 0 _ a n n " c l a s s = " a n n o ta t i o n " > < / d i v >
 < !- - U n n a m e d (单选按钮 ) - ->
 < d i v i d = " u 2 1 " c l a s s = " ax _ d efa u l t ra d i o _ b u tt o n " >
 < l a b e l fo r = " u 2 1 _ i n p u t " >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 2 2 " c l a s s = " t ex t " st y l e = " v i s i b i l i t y : 
v i s i b l e ; " >
 < p > < s p a n >同 意 动 物 朋 友 协 议 < /s p a n > < / p >
 < / d i v >
 < / l a b e l >
 < i n p u t i d = " u 2 1 _ i n p u t " t y p e = " ra d i o " va l u e = " ra d i o " 
n a m e = " u 2 1 " / >
 < / d i v >
 < !- - 登 录 按 钮 (提交按钮 ) - - >
 < d i v i d = " u 2 3 " c l a s s = " ax _ d e fa u l t ht m l _ b u tto n " d ata -
l a b e l = "登录按钮 " >
 < i n p u t i d = " u 2 3 _ i n p u t " t y p e = " s u b m i t " va l u e = " 登 录
" / >
 < / d i v >
 < !- - U n n a m e d (矩 形 ) - ->
 < d i v i d = " u 2 4 " c l a s s = " ax _ d efa u l t _二级标题 " >
 < d i v i d = " u 2 4 _ d i v " c l a s s = " " > < / d i v >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 2 5 " c l a s s = " t ex t " st y l e = " v i s i b i l i t y : 
v i s i b l e ; " >
 < p > < s p a n >账 号 < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - U n n a m e d (矩 形 ) - ->
 < d i v i d = " u 2 6 " c l a s s = " ax _ d efa u l t _二级标题 " >
 < d i v i d = " u 2 6 _ d i v " c l a s s = " " > < / d i v >
 < !- - U n n a m e d ( ) - ->
 < d i v i d = " u 2 7 " c l a ss = " t ex t " st y l e = " v i s i b i l i t y : 
v i s i b l e ; " >
 < p > < s p a n >密 码 < /s p a n > < / p >
 < / d i v >
 < / d i v >
 < !- - 登 录 (动 态 面 板 ) - ->
 < d i v i d = " u 2 8 " c l a s s = " ax _ d efa u l t " d at a -l a b e l = "登 录 " >
 < d i v i d = " u 2 8 _ st ate 0 " c l a s s = " p a n e l _ stat e " d at a -
l a b e l = "账号登录 " >
 < d i v i d = " u 2 8 _ stat e 0 _ c o n te n t " 
c l a s s = " p a n e l _ stat e _ c o nte nt " >
 < / d i v >
 < / d i v >
 < d i v i d = " u 2 8 _ st ate 1 " c l a s s = " p a n e l _ stat e " d at a -
l a b e l = "二维码登录 " >
 < d i v i d = " u 2 8 _ stat e 1 _ c o n te n t " 
c l a s s = " p a n e l _ stat e _ c o nte nt " >
 < / d i v >
 < / d i v >
 < / d i v >
 < / d i v >
 < / b o d y >
< / h t m l >

总结

以上就是该实验的大部分内容了
学 习 了 如 何 使 用 原 型 图 设 计 工 具 来制 作 软 件 的 用 户 界 面 。我 认 为 这 是 一 个 很 有 用 的 技 能 ，因 为 它可 以 帮 助 我 更 好 地 理 解 用 户 的 需 求 和 期 望 ，以 及 如 何 提 高 软 件的 可 用 性 和 易 用 性 。通 过 原 型 图 设 计 ，可 以 快 速 地 展 示 我 的设 计 思 路 ，收 集 用 户 的 反 馈 ，以 及 进 行 迭 代 改 进 。尽 量 保 持 了 界 面 的 简 洁 和 一 致 ，使 用 了 清 晰 的标 签 和 按 钮 ，以 及 合 适 的 布 局 和 颜 色 。还 考 虑 了 一 些 异 常 情况 ，例 如 用 户 输 入 错 误 的 账 号 或 密 码 。