我的审美是不是出现了偏差,这个设计真的很丑吗?

[agdhole]

在线预览: https://www.inbuff.cn/

已经有几个人让我删了重写了,是我的审美出了偏差?

设计参考: https://www.microsoft.com/design/fluent/

吸收了各位的意见,做了一点小调整:

黑色版本布局和色调有问题,
不知道各位老哥看看类似白色色调的怎么样:
https://dev.inbuff.cn/

Fluent Design 还是不适合我这种对设计一无所知的,照着抄都抄不好,
决定用 MD 去抄 Google 家的产品介绍,例如:
https://www.google.com/intl/zh-CN/about/products/
https://www.google.com/search/about/ ,
https://www.google.com/chrome/.
不过这种网站用图片的好多,完全不知道图片应该放什么从哪里找.

[levenmode]

没偏差，是真丑

[lausius]

上半部分不错，下半部分还要排版。

[mary9]

留白真多，文字不够醒目。布局也不合理。

[SKYNE]

配色有点问题吧

[huiyadanli]

这配色简直对眼睛的摧残。。黑与亮绿。。看着很难受

[JCZ2MkKb5S8ZX9pq]

视觉元素单调，可以考虑加背景或者底纹。
对齐逻辑杂乱，区块划分随意。三方块的内部上下左右边距都不一样，其它对齐也有问题，阅读顺序也没有照顾到。
移动端适配问题也不少。

白色版影子叠方块，黑按钮加黑影，又多出来不少小问题。

现代设计有个可以算通识的基础，就是 [形式服务于功能] 。一些简单的原则，比如重要的内容站视觉重点会比较大，比如阅读顺序的设计，就都是服务于功能的 [设计] 。
所有的大前提还是想明白要 [说] 啥。比如 [了解更多] ，是不是应该占最大的视觉重心，这个就看你想的表达意图了，也就是 [功能] 。表达意图明确了，再用一些美术的技术去突出该突出的，隐去不需突出的，引导用户阅读，这是所谓 [形式] 的部分。

现在流行极简风格，用色少留白多，应该是 form follows function 的结果，不是目的。

[sphawkcn]

其他的不说了，就第一眼布局就有大大的问题。顶部核心区空那么一大块留着过年吗？

[Kylin30]

你抄的这个微软的底子本身就不大好看

[gimp]

事实证明，常规布局确实有道理的...

[soho176]

白色的还行，黑色是真丑。

[iConnect]

黑色很酷，但很难掌控，没两把刷子不要轻易用。白色的不容易好，但也不容易坏，自认为审美眼光上不去，最好的方式就是内容即设计，MD 风格其实更容易掌握，FD 有点难度。

[sxlzll]

本来一屏能显示完，非要搞那么多无用的宽间距
字体大小和比例也不对劲

[fossis]

[wsh1108]

现在应该是流行大量留白，简约的

[zn]

各个组件单独拿出来看的话还可以，但是整体放在一起看真的丑，一点都不协调。实话实说。

[tetsai]

要么全黑要么全白啊，这两个完全搭不在一起的配色咋看

[fuermosi777]

挺好看的，但是很多细节处理得很糟糕。比如对齐，padding 等等。

[asdf123101]

大概是对比度太高了吧

[dartabe]

非常丑 配色有问题

[bomb77]

老老实实对齐不好吗

[EugeneYWang]

知其然也要知其所以然啊。

微软这种工业设计肯定有目的的，人家用黑色打底是为了突出内容。微软就是为了突出一个 logo，你看他下面几个 Div 也配合内容改变了背景色。

说到底还是让专业的人做专业的事情，不然至少学一下配色在设计里的应用。

[EugeneYWang]

BTW，我是不觉得 LZ 的内容和内容设计有什么值得用黑色打底，没什么好突出的呀。你用了黑色打底，又多一块白色的背景。就像一条黑色礼服打了一块白色补丁一样显眼。个人看法是微软的设计没问题，LZ 抄的不到位，没有设计语言的概念

[EugeneYWang]

最新一个白色打底的好太多

[KasuganoSoras]

你这个主题太 Dark♂了

[tsui]

就算抄设计抄的像，怎么也不能抄 MSFT 啊。。

[tL28Qt7jS56Yy8F9]

配色有点问题，留白太多了

[tL28Qt7jS56Yy8F9]

这种亮荧光色和黑白加上扁平化。。。
https://colorhunt.co/
配色从中可以获得一些灵感。

[Ailoli]

不好看，落差太大了

[secsilm]

布局差不多，缺张背景图

[crazygod]

你这个配色太 low 了

[agdhole]

@iConnect #111 MD 的确实好抄点,也没有什么布局配色风险.

@EugeneYWang #122 设计太难了,昨天在看设计布局入门的文章,还是先用 MD 顶上去吧,等修炼到一定水平了再去尝试其他的.

@ilgharkus #127 谢谢,配色确实有很大的问题.

@fossis #113 懂设计的就是不一样啊,一下子好看了十倍.

@crazygod #130 老实说是个人非常喜欢这个高对比的黑青色,不过 95% 的人都觉得瞎眼

@JCZ2MkKb5S8ZX9pq #106 写代码的时候随便写了几个框框就完事了,没想到设计还有这么多门道,什么对齐阴影字体大小这些的.

[HarveyDent]

《写给大家看的设计书》

[agdhole]

@paicha #76
@HarveyDent #132
谢谢,这书看评价挺高的,准备入手一本学习学习.

[ioth]

不美。

[zh0408]

不是同一个色系的颜色不要超过三种

[LuciferMoo]

颜色反差太大, 纯黑纯白这种, 看着眼睛有点疼...

[cedoo]

第一感觉， 类似外国网站风格， 但是 中文字体没选好， 看着很敦实，简单来说 ， 很丑。
PS： 为啥我感觉英文字体的选择性要大很多。

[pandasoda]

白蓝配 我觉得不错

[LWXYFER]

这个大横杠 23333

[agdhole]

@LWXYFER #139 这个大横杠我超级喜欢

@cedoo #137 完全不晓得有哪些好看的中文字体


@LuciferMoo #136 确实,反差太大了

[dartabe]

感觉白色调没什么大问题

[ii4Rookie]

布局有问题

[chuhemiao]

@lingo 单纯的看一下，刚上线，好多朋友说丑。。。快讯那块确实有待改善，还没有啥好想法。
@intellectual 所以重点是妹子吗。。。

[impony]

设计先从对齐开始

[zhuxd282]

@impony #144 同意，基本的对齐没搞定，纵向的每一个区域，都没有线条感。

[Admstor]

不要随便模仿微软的布局
真的挺难做到那么好看
相比较苹果的模仿起来就容易多

[tudage]

@fossis 白字字体是啥 老铁

[fossis]

@tudage #147 #147 思源黑

[tieshu]

黑色太黑了，不好，看着压抑，不要纯黑，可以灰一些。字体颜色太亮了，可以暗一些，或者换个颜色。下面白色，跟上面黑色反差太大了，要不就设计成两页，上面是黑色基调，下翻一页，是白色基调。

[a632027512]

没人吐槽打开网站超级慢吗。。。黑白色对比太难受了。

[koal]

我能说，非常丑吗？

[sunzongzheng]

看图片，文字很小也很难受