Quantcast
Channel: 少数派
Viewing all articles
Browse latest Browse all 13768

一天一张卡片,高颜值日记应用:卡片日记 | App+1

$
0
0


卡片日记为你提供了一个写下思考,感受,发现,探索,记忆和美梦的完美栖息地。我们生活在一个信息过载的时代,太多的碎片和噪音让我们很去倾听自己的心声。写下日记的同时,放慢你的脚步,安静的去聆听内心的呼唤。

主页交互

开发者前言

我想开发卡片日记是我 2017 年第二件最令我开心的事情了。刚开始,我想写个日记类的 app,但我没有设计的天赋,所以我就去了 dribbble 上找了类似的设计,于是就找到了 Card Diary 的设计原稿:Card Diary - iOS App。尝试着联系了作者 Unbong Kang,他表示同意由我去实现这个概念。当我完成了第一版的概念设计之后,他决定把概念全面实现。于是,便有了现在这个应用。

我想由衷的感谢卡片日记的韩国设计师 Unbong Kang 的超强设计,目前 Card Diary 在 Behance 的交互类排行第一(2017-12-19 获得了交互类:特别推荐项目)。不得不说,和 Unbong 的合作真的是非常愉快和开心的事情。他对设计的细节非常的注重,我经常为一个 UI 的改动而重做好几次。他同时还是一个找 bug 高手,他找到的 bug 数量是我的两倍还多。

这篇文章的主体,我想用 Unbong 的角度来写,毕竟他对卡片日记的理解,比我要深的多。

UI Design

设计师自序

工作室「Rhythmic Studio」是由韩国设计师(Unbong Kang)和中国开发者(傅圆)组成的一个团队。

一天,一个叫傅圆的中国开发者找到了我,他想实现我发布在 dribbble 上面「Card Diary - iOS App」的设计概念。我接受了他的建议,没过多久他就给我展示了他的实现成果。我对这个应用产生了兴趣,我们同意在 App Store 上发布这个应用。尽管我们说着不同的语言又生活在不同的国家(韩国和新西兰),我们还是完成了这项工作。一个韩国设计师和中国开发者的合作让这个工作变得非常有趣。谢谢你,圆,帮我实现了这个设计。(译者圆注:也谢谢你,Unbong,让我成功的发布了一个应用)

卡片日记

卡片日记是一个以卡片为概念的日记应用。当你在每张卡片上记下了你的生活之后,这张卡片便有了意义。你可以一年创建 365 张卡片,你也可以设计和定制所有的卡片。你可以让这本日记变得非常美丽,即使你的日记只有一张图片或者一句话。我们觉得你的每一天都是充满意义的。所以这本日记会让你留下每一个充满意义的回忆。

卡片日记的图标来说,由方框组成的 logo 意味着一张卡片和「日记标志」。我做了这么一个简单的结构来专注于内容,并且我用了一种给人以清晰而明确的印象的颜色。

icon 设计

每年已经创建了 12 个月的卡片。你可以每天创建一个日记,日记有两种类型,照片类型和文字类型。

设计理念简单而纯净。它的简约是为了避免复杂性。我们花了很多时间来设计排版和互动。比如日历以翻转动画的形式从卡片背面呈现。通过自定义卡片的颜色或者图片,让你的 12 个月都充满了不同的意义。同时,多语言和 iCloud 同步备份的快捷性保证了最有效和最有力的后台支撑。

你可以匹配每月卡片上的 20 种颜色。 通过定制卡片的颜色来创建一个简单的日记本。颜色由 15 个柔和色调和 5 个单色组成。

Card Diary

你也可以使用照片来装饰你的卡片。每个月的照片诉说着你每个月最灿烂最阳光的心情,这会让你每个月都变得与众不同。

通过每日卡片你可以看到更多的细节。照片类型在列表中是高亮显示,你可以最多添加 9 张照片。你可以在文本区域写下标题和日记内容。天气的记录让你可以写下更多的心情日记。

没有复杂的功能,只专注于你的一天。此外,与时尚,饮食,旅行,育儿,食品,阅读等很好搭配一起。

现在,就写下你的日记吧。


App StoreCard Diary App Store

Website : CardDiary.me

Behance / dribbble / Uplabs

UX / UI Designer: Unbong Kang

lain.kr / Dribbble / Facebook /  Twitter / Instagram

iOS Developer: Yuan Fu

mrfu.me / Instagram / Twitter / Facebook / Weibo



Viewing all articles
Browse latest Browse all 13768

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>