|
软件网址: https://paper.tthaoke.com 一、为什么要做这个软件? 家里几个小孩上学需要,买了台激光打印机用来打印作业什么的。最近发现学校老师布置了一些拼音、算数和书法之类的作业,需要用到有线条的纸张。虽然某宝这类纸不贵,但小孩作业也就偶尔用上几张,买一整本不划算。 网上一搜这类网站,格式撮的要命,啥功能都没有都要收费。有些格式甚至只有几张图片实现,都要收月费,太坑了。有网友贴过【纸由我】这个网站,免费且格式还比较多。但是发现有些稿纸不支持调格式,不支持添加额外的文字头,还有一些日常经常用的稿纸没有(像课程表)。 Word 或者 Excel虽然能做,但是调格式什么的都好麻烦,如果不是经常弄办公软件的同学估计得画半个小时去查各种教程。 想着自己也是后端程序员,没学过React,刚好把这个项目当成练手项目。前前后后用了一个多月时间发布了软件的第一版。 二、软件功能设计 基于中小学生日常常用的稿纸类型和场景,软件功能设计列了以下几个要点: 界面干净简洁,操作简单友好,家里人都会用。 稿纸包含小学生常用的:作文纸、算数纸、英文、五线谱、田字格等,中学生可能会有用到的:康奈尔笔记、思维导图、打卡等,还有大人可能需要用到的便笺纸。后来发现把课程表加进来也不错 :D 稿纸格式除了可以灵活调整线条样式、背景颜色外,还加了一些高阶功能:纹理、水印 纸张类型参考了Word设计,把常见的纸张类型、纸张方向、边距等。 稿纸输出方面支持PDF下载(方便分享给其他学生)、图片下载(可能会被嵌入到Word里面打印),当然支持一个基本的直接打印功能是需要的。
三、界面设计: 主界面:
 选项区规划:
 其他辅助功能,如帮助、新手引导、页面提示入口(也包含帮助) 主界面布局比较稳定,一开始就定了,调整比较多的是【选项区】,一开始大部分稿纸不支持页眉,用了竞品的一些产品发现,很多稿纸实际在用的时候多多少少都需要加一些辅助的文本、伪输入框,方便线下打印出来后使用。 例如学生类纸张需要“班级:__________ 成绩:__________ ” 这种打印出来的填写框。没必要为了这种额外增加稿纸类型。 还有部分稿纸需要额外一些特殊的控制选项。例如五线谱可能需要选择音符、思维导图需要设置文字内容、康奈尔笔记可能需要配置不同区域样式,等等。 于是后来把【页眉】【文字内容】【笔记本特有选项】放在了【基础设置】里面。 二、软件优点(自我感觉): 1、免费、免登录、无广告; 2、支持多种格式的稿纸,支持非常灵活自定义格式(例如线条格式调整不变形),大部分稿纸都可以调整线条样式、背景、纹理、水印、打印格式等; 3、支持自定义稿纸头部,类似稿纸前面的 “班级:____ ” 的填写框,市面上其他稿纸定制网站基本没有这个功能。 4、部分稿纸支持填充文字,例如书法类用来填充文字模板,可以直接打印出来练习书法。 4、支持文字水印,方便打印后识别; 5、支持PDF下载、2倍高清图下载,方便打印前预览; 6、支持各种纸张类型、方向和页边距等(对齐Word),调整纸张后原来的稿纸还能动态适应。; 7、一些特殊类的稿纸还支持额外的控制选项,例如: 五线谱支持设置音符; 分镜纸支持设置块数量、间距等; 课程表支持课程数量、星期数量、甚至填充课程表等; 康奈尔笔记支持标题区、摘要行数,以及各区域是否显示横线等; 思维导图支持设置引导文字(某宝热卖的思维导图笔记本款式 :); 每日打卡稿纸(平台热卖笔记本款式); 便笺纸(平台热卖款式)支持标题文字内容和样式; 米字格支持调整单元格大小,软件默认了【毛笔字】【硬笔字帖】几种格式可以一点生效; 8、界面交互个人觉得还算简单易用,类似预览这种交互做了一些人性化的选项。 三、开发过程遇到哪些问题? 1、会一些JS语法但是之前没搞过SAP(单页面引用),一开始试了一下 Vue,发现东西门槛有点高,各种语法根本就是Vue作者自己设计的,奇奇怪怪的语法糖约定很难记忆,常见熟悉的JS语法逻辑很难用上。于是试了React,算是非常好上手。由于React有比较完整的框架设计,一些诸如 useState、useEffect 等钩子函数还是花了一些时间(AI辅助)来理解。 2、重新封装了 [Dialog] [Novice] 等一些前端组件花了些时间 3、软件界面来来回回改了好几次,尤其是顶部菜单和选项框。现在个人感觉用起来顺手一些。 4、各类稿纸格式的布局计算还是优点复杂。要考虑到纸张尺寸、页边距变化、线条粗细变化(是的没错,线条粗细也会占空间)、线条间距调整等等,例如一个简单表格类型的稿纸就不能简单计算各个线条的位置坐标了。例如脑图、打卡笔记的线条坐标还是比较复杂的。课程表这种不仅仅需要设计表格,还要提供填充课程的功能也算是代码量比较多的功能之一了。 四、最后 软件后续还会不定期迭代,我看到电商平台上有什么比较好的笔记本款式,或者有新的需求,都会尽量加上。 当然,如果你使用过程遇到什么问题或需要添加功能,直接告诉我那是最快的💝。 目前版本软件演示:
|