Divi 设计展示:2019 年 5 月的新提交

已发表: 2019-05-31

又到了我们每月的 Divi Showcase 时间,我们将在那里看看我们社区成员制作的 10 个很棒的 Divi 网站。 每个月我们都会展示从我们社区提交的最好的 Divi 网站,今天我们想与您分享五月份的前十名网站。 在整篇文章中,我将指出一些我最喜欢的设计功能,这些功能将我吸引到每个网站。

我希望你喜欢他们!

Divi 设计展示:2019 年 5 月的新提交

1.叉腰

本网站由 Alan Cox 提交。 该网站使用灰色阴影的线描艺术作为背景,并在整个过程中使用彩色人物图画。 按钮和其他图形元素也是彩色的,以从网站的设计中脱颖而出。 这在将重点放在产品和号召性用语方面做得很好。 它通过全屏英雄部分、产品演示、两栏可用性部分、单栏使命陈述、推荐和与页脚重叠的 CTA 来保持设计简单。 Science 页面以其大标题和品牌图形而有趣,同时保持设计简单。

访问网站

2. Dapper Tapper 杂志

本网站由 Carlos Godoy 提交。 本网站使用 Extra 来创建优雅的杂志设计。 它显示一个全屏英雄部分,背景图像为视差,徽标位于中心。 滚动显示菜单,当它到达屏幕顶部时仍保留在原位。 文章放置在三列的多列布局中。 其他帖子以单列滑块显示,然后在底部有一个供进一步阅读的部分。 博客文章将文本放在一侧,将图像放在另一侧。 该站点还具有一个大的下拉菜单和一个预加载器。 我不会猜到这是额外的。

访问网站

3. 底图

本网站由达斯汀奥尔森提交。 该网站将产品的演示和 CTA 放置在屏幕中央的背景图像上,帮助读者一目了然地了解产品的用途。 其他几个具有类似设计的部分从一侧展示了产品,但这次是两个带有屏幕截图、动画或视频的演示,它们与下一部分重叠。 演示完美地展示了产品的功能。 我喜欢风格化的定价表。 博客也很有趣。 它包括一个滑块,后跟一个两列过滤的博客网格。 这些帖子包括优雅的叠加层。 侧边栏也适合该网站的设计,并包括一个 Instagram 提要。 这个网站的摄影很棒。

访问网站

4. DH营销数字

本网站由 Douglas Henrique Monteiro e Silva 提交。 它显示一个全屏图像,一侧是主题,另一侧是背景,为标题、标语和 CTA 留出空间。 服务使用彩色图标以项目符号显示。 服务的统计数据显示为带有图标的垂直切换的有趣图形。 推荐信显示在利用方框阴影和星级评定系统的卡片中。 一个部分在图形后面有一个背景图案。 CTA 重叠了两个部分,并且非常突出。 我喜欢在服务页面上优雅地使用简介。 他们使用彩色图标并创建带有悬停效果的纤薄卡片。 该网站使用了大量的空白空间并优雅地使用了色彩。

访问网站

5. 约克

本网站由 Sander Goorman 提交。 它使用蓝色渐变来显示全屏背景图像,并在一侧显示带有服务导航的标语。 Blurbs 与下一部分重叠,并提供有关每项服务的详细信息。 简介是带有蓝色图标的干净卡片。 它们在悬停时向上上升,与网站的设计完美契合。 展示他们故事的部分在一侧使用多色大文本,在另一侧使用常规文本。 他们的作品示例显示在交替布局中,并带有查看作品的链接。 我喜欢博客设计。 它在带有叠加层、标题、类别、作者姓名和按钮的网格中显示帖子,以在弹出窗口中查看特色图像。 所有这些都放置在特色图像上。

访问网站

6. 偶像

本网站由 Oliver Gehrmann 提交。 带有标语的多张图像显示在全宽滑块中,然后是带有样式块标题的关于部分。 了解更多按钮会打开一个整页弹出窗口。 了解更多按钮在整个设计中都很突出,非常适合节省空间,同时提供对大量信息的访问。 使用在悬停时更改颜色并在单击时打开弹出窗口的图形提供更多信息。 更多服务通过滑块内的图形和信息按钮显示。 一个类似的滑块显示了讲师的图像。 讲师页面显示两列,其中包含一张大照片和每个人的信息。 我喜欢活动页面。 它使用带有下拉框的过滤器。

访问网站

7. Bio-Bausewein

本网站由迈克尔·科赫提交。 这个显示了一个全屏图像,主题上方有一个标语,并以树的形状覆盖以装饰两侧。 这些和类似的形状出现在整个场地的两侧。 下一部分显示不同页面的 CTA。 CTA 使用带有不同颜色叠加层的大图案背景。 较小的 CTA 使用类似的设计以及博客卡片设计。 一种采用倾斜设计。 我喜欢显示所有者的部分。 它显示了一个全屏图像,下面是与照片中人物附近的图像重叠的文本块。 事件页面显示类似于内嵌博客文章的事件,顶部有一个栏来显示日期。 我喜欢这个网站上的摄影和色彩。

访问网站

8.生态主机

本网站由 Emy 提交。 该网站采用单页布局,采用扁平化设计,整个网站的背景和图标均采用优雅的红色、绿色和蓝色色调。 背景图形和其他元素有助于描述公司的使命。 功能与简介一起显示,以创建带有大图标和标题的卡片。 类似的卡片用于推荐和联系信息。 我喜欢定价表。 它们包括一个切换开关,当您单击切换时,价格会显示动画。 当您单击以查看信息时,一些卡片会在弹出窗口中包含信息。 该网站充分利用了图形、背景图案和颜色。

访问网站

9. 717媒体

本网站由 Eike Muller 提交。 它在整个网站的文本、按钮、动画和背景中使用浅绿色作为品牌颜色。 甚至滚动条和返回顶部按钮也是绿色的。 大卡片显示带有图像、文本和按钮的服务。 卡片在悬停时显示阴影。 它包括一个有趣的 CTA,它具有全宽背景和深色覆盖层。 当您滚动到它时,会在文本周围绘制一条绿线以引起注意。 我喜欢关于部分。 它使用图像和文本在卡片中显示信息。 这些卡片与下一部分重叠,并包含动画覆盖。 该网站在每个页面上都充分利用了小动画和绿色亮点。

访问网站

10. PicknRoll

本网站由罗伯托·瓦格纳 (Roberto Wagner) 提交。 这是一家网上商店。 主页使用带有多种颜色的大文本的背景图像向商店显示全屏 CTA。 商店部分以三列显示产品,覆盖层中有一个与网站品牌颜色(粗体黄色)相匹配的图标。 信息部分显示了与视差背景图像相比的优势。 推荐书和时事通讯部分采用类似的黄色文本样式。 商店页面遵循相同的设计,但在英雄部分添加了搜索功能。 该博客目前只有一篇文章,但该页面的设计很酷。 博客文章与英雄部分重叠,时事通讯与两个部分重叠,包括页脚上方的社交关注部分。

访问网站

在结束

这是我们 5 月份提交的 10 个最佳社区 Divi 网站。 这些网站看起来很棒,我们一如既往地感谢大家的提交!

如果您想考虑您自己的设计,请随时通过电子邮件发送给我们在 nathan 的编辑,地址是优雅的主题 dot com。 请务必将电子邮件的主题设为“DIVI SITE SUBMISSION”。

我们也希望在评论中收到您的来信! 告诉我们您喜欢这些网站的哪些方面,如果他们做了什么,您希望我们在博客上教给我们。

精选图片来自 L-astro/shutterstock.com