做了个超好看的个人网站

7次阅读

共计 789 个字符,预计需要花费 2 分钟才能阅读完成。

以往到了求职面试的季节免不了要做一套动辄 20-30 页的作品集。除了痛苦还是痛苦。

自由职业一年后悟到,PDF 还是太干瘪了,不如网站更能直观地展示项目成果,更重要的是能及时更新作品进去。两者都可以有,但如果只取一个的话,我认为还是做网站!

同时也把个人网页当成一个项目去完成。调研 > 风格探索 > Responsive 一个不能少。

最终成品 👉 https://echozhang.framer.website/

因为最近半年都在做活泼快乐的视觉风格,我个人的网站也延续了这种快乐风格。也许过几年就整个换头。

使用的建站工具是:Framer,在 Webflow 和 Framer 考虑了一阵后还是选择了 Framer。原因 👇

搭建难度:整体上手还比较快。(也踩了不少坑)建议开始搭建之前先大致看一遍教程,有很多细节自己很难探索出来。

Figma 导入流程:基本我在 Figma 完成整个设计,再复制到 Framer,整个过程还比较顺畅。小 tips 是:需要分 Frame 去导入,一整个页面是导不过来的。

Responsive:这个是最麻烦的地方。Framer 里的 Responsive 是子母级的关系,比如 1440 Desktop 标准版是母亲,那其他 Breakpoints 是「子」。Desktop 的 Responsive 设置得好,其他的 Breakpoints 只需要一些细节的调整。整个 Responsive 需要一定时间的探索和试错。我最后舍弃了完美,Responsive 整体效果 ok 就 ok(是进步 …

缺点我个人觉得只有 2 个:
Responsive:布局复杂的话,responsive 会很难做,所以第一次尝试就往简单了做吧,重点是一个完成的动作。

尺寸:也因为好 Responsive 的关系,我很多元素都选择了切图,大家千万不要切太高清的图,1440 的网页差不多切 1.5x 即可,因为 Framer Pro 以下的版本只有 5mb 的容量。

好喜欢我的网站!

做了个超好看的个人网站

做了个超好看的个人网站

做了个超好看的个人网站

正文完
 0