小词典软件——UI设计

 

原型设计介绍

1.载入界面

　　　

 

 

 

2.主界面-词典

　　　　

 

 

　　　　词典界面，左上角可选择语言，输入单词后点击查询可查询。

3.翻译界面补充

　　　　

 

 

　　　　查询后显示该词在词典中的内容，点击“心”可收藏至单词本，再次点击取消。

 

 4.主界面-翻译

　　　　

 

 

　　　　点击下方“翻译”进入翻译界面，左上角可选择语言，输入需要翻译的句子后点击翻译。

5.翻译界面补充

　　　　

 

　　　　点击 “翻译”按钮后，显示翻译后的句子，根据需要可选择是否逐句翻译。

6.主界面-单词本

　　　　

 

 

　　　　点击下方“单词本”进入界面，可以看到收藏的单词，左上角可以选择排序顺序，当单词很多时可以选择右上角搜索框搜索。

 

说明：

界面设计采用Mockplus软件，界面设计展示使用Mkplus(手机端)录制，上传至github，最终页面流程图如下：

 

 

　　　　

部分实现内容

https://github.com/whucs201703/whucs2017no8