作为后端程序员，我做的网站被 Bulma.css 作者推荐到官网了（有个人经验分享）

[Wichna]

本人是一位货真价实的后端程序员，业余时间做一些 side project，比如最近两年一直在做的就是一款叫Anyshortcut 的 Chrome 插件。之前帖子有介绍: /t/415551

从刚开始前端一窍不通，设计一窍不通，到一点一点学习坚持，把 Anyshortcut 官网做到了我比较满意的地步。前两天我看到 Bulma.css 的作者把 Anyshortcut 也推荐到Bulma.css 的官网上了。

感兴趣的朋友可以看看我做的官网： https://anyshortcut.com

使用的前端技术：

• bluma.css
• Vue 2.x
• Vue router

设计工具

• Sketch
• Photoshop (女朋友帮我设计的 logo，做了一些图，定的主色调，其他大部分都是我自己的点子，自己设计的)

一些需要登录之后才能看到的页面

用户绑定的快捷键详情

用户订阅成功之后

用户支付方式，即信用卡详情

用户更新信用卡

用户的优惠码页面

个人经验

• 最重要的是多看国外的 SaaS 网站，多学习，不断提高自己的审美，去 Dribbble，Behance 等网站找灵感
• 先确定好主色调，至少选两种字体，一种适合做标题的字体，一种是普通文本字体，然后定好几个标题的大小和颜色。比如 heading, title, subtitle, text, subtext 之类的
• 可以先用一些原型工具设计一下自己脑海中的页面，比如我一直在用的墨刀 (用这个链接注册你我都有优惠，哈哈) 。 大家可以在这看到我最开始设计的原型:https://modao.cc/app/ARvscvpdmhno0NBixRbt0nMTc277hz0
• 一定要用一款成熟度高的 css 框架，比如 bootstrap, bulma.css, 或者一位国人写的spectre.css。如果不用兼容 IE 系列的话，尽量用 Flexbox 布局
• 图片尽量用 svg
• 一些不会写的 UI 控件，可以去 github 或者 codepen 找找借鉴一下
• 自己动手用在 codepen 或者在Web Maker（我自己经常用的 Chrome 插件）实现一下，然后在集成到自己的项目中

有什么问题，欢迎大家一起交流。

[feng33]

用来做什么的，现在付费用户多吗

[shiny]

看到了语法错误：Your already added your credit card

[Wichna]

@feng33 #1 一款自定义快捷键快速打开常用网页的插件，目前还没有写好教程，可以看看我那个帖子。欢迎你体验一下。😄

[Wichna]

@shiny 还真是，感谢提醒

[est]

赞一个。

[Wichna]

@est 谢谢你的肯定

[GooMS]

Stripe 怎么纳税？

[oott123]

重点是有个画 logo 的女朋友。

[Wichna]

@GooMS Stripe 收手续费，个人开发者，不用纳税吧

[Wichna]

@oott123 嘎嘎嘎，这个还是有点重要

[crysislinux]

楼主在国内么，怎么搞定的 stripe，不会搞了 atlas 吧。

[Wichna]

@crysislinux 在国内，绕了弯搞定 Stripe 的，Atlas 试过，成本还是有点高，不适合我的小项目。感兴趣可以看看我另外一个网站，我整理了很多申请 Stripe 的途径 https://paybase.cn/

[Wichna]

@Wichna
@oott123
Paybase 这个 logo 绝对是我自己用 Sketch 设计的

[ericls]

好了 知道你有女朋友了

[wtf94666]

好看 新手设计师自愧不如

[hugee]

高手

[twor]

非常感谢，我免费订阅 1 年的
不过不好意思问，如何防止自动续费？我看没有取消的选项

[cctrv]

+1
我也想知道如何取消自動訂閱。

[Wichna]

@hugee 真的不是什么高手，只是多花了很多心思和时间去学习实践出来的

[Wichna]

@twor
@cctrv
谢谢订阅，可以无理由取消订阅的，现在需要发邮件才行，FAQ 里面有写。后期会在官网加上这个功能，直接点个按钮就取消自动续费了。