搜索内容：
时间：2017-11-01
编辑:网站制作公司
2008
1
这篇文章都是关于独特的布局解决方案;这意味着我将会谈论八个不同的网站，这些网站以一种独特的方式呈现一些典型的东西。我们将从展示产品的独特布局解决方案，将个人和人类元素纳入一个网站。
1. HARVARD REINVENTS THE INFAMOUS CAROUSEL
哈佛设计学院网站有一种独特的导航方式。当你第一次登陆首页的时候，你会看到一个导航的视觉显示。当然，这里没有任何链接，只有几个关键的链接。许多网站已经接受了链接到主页头的更重要的页面;这就是我们的传送带。但是，我还没有看到另一个网站以这种方式呈现。导航可能很小，但它是正面和中心。更重要的是，它看起来是属于那里的。执行异常。
左边的图像相互重叠但你仍然可以看到有多少。在左边的图像和标题之间有清晰的关系。这些图像与左边的物体旋转。然而，在任何给定的时间，您都知道哪些信息是可用的。这就像哈佛的设计学院创造了一个改良版的旋转木马本来应该放在第一位的。在这个设计方案中，可用性不仅被认真对待，而且布局也是独一无二的。这两个因素共同造就了一个奇妙的视觉设计。
很明显，Tra的网站使用了非传统布局。网站总体上是最小的。他们还使用一种反向配色方案，背景为黑色，文字为白色。配色方案无疑给了它一个令人惊叹的因素。然而，这是关于Tra网站的布局。让我们从主页开始:主页上有几条文字，大部分都与背景图像重叠了一点，除了“我们知道的人”部分的段落拷贝。该副本是专门为脱离图像而对齐的。它是不同的，它是独特的，它是值得注意的。
在about页面上，有更多的顺序和使用网格。但是，网格仍然是不规则的。似乎关于页面的每个部分都有自己的网格。这个页面最吸引我的是页面左上方的图片。它只是不适合任何东西。当然，这让我很好奇。结果显示图像是一个gallery -你必须点击它才能使图像打开。这是一个很聪明的方法来利用布局;关心调查的人会得到一大堆图片。那些不关心的人，也不要损失太多。这是一个有趣的复活节彩蛋。
这个独特的布局解决方案的例子围绕一个在线鞋店。Feit的产品页面太棒了。首先，设计充分利用了屏幕的宽度和高度。这意味着屏幕的每个区域都被指定为特定的目的。其次，网站简单、简约、干净。这意味着即使设计确实使用全屏，也不是凌乱的。这是一件很好的事情，因为大量的设计都依赖于空白，以形成一个整洁的网站。
这个产品页面最让我印象深刻的是布局的布局方式。这个页面具体分为三个不同的部分。首先，左边是导航。这很标准，也没什么特别的。然后是右边的产品细节。两者，左手边导航和细节部分都固定在屏幕上。但是，最后一部分，中间的照片部分，充满了可滚动的照片。我认为这是一个很好的解决方案，因为它不是最常见的解决方案。
通常情况下，如果有大量的产品照片，就会留下信息。在这里，当我向下滚动时，我仍然看到产品的描述和名称，我仍然可以看到它进来的不同颜色，可以访问更多的信息，如我不需要上下滚动的材料的细节。总的来说，对于潜在客户来说，这是一个无缝的体验。
这里我们有另一个产品页面和另一种展示产品的方式。好吧，我们还有另一个鞋子的例子!Afura的网站也有一个独特的显示方法。这一次，鞋子在页面上有多个不同的镜头。它实际上是carousel UI元素的一部分。然而，这里的可用性并不是一个大问题。对于初学者来说，默认情况下，桌面或笔记本屏幕尺寸上显示的是三个图像。默认的图像都有相同的背景，这使得显示的效果很好。如果用户没有意识到图像是旋转木马的一部分，他们至少会在他们的电脑上看到三种不同的产品图像。对于像平板电脑这样的小屏幕尺寸，默认是一次显示两个图像;这仍然是相当不错的。总而言之，这里的鞋产品展示是一个独特的设计方案。
首先，我认为网络是一个客观存在的地方，我们通常不会看到人类;真正的人在应用程序，产品，公司等等。我一直努力在我的设计中包含一个人元素。我可以看到Opendoor想做同样的事情。在他们的主页上，大约在半路上，是一个叫做“我们有你的背”的部分。“它应该解释，在Opendoor公司背后有真正的人类，他们在那里帮助他们的客户每一步。”现在，Opendoor本来可以把它放在那里，但取而代之的是，他们放了一张他们员工的一张大照片。
这部分内容很少。相反，照片和脸是这部分中更重要的部分。我甚至可以说这张照片以100%肯定的方式压倒了这部分。如果这张照片是缩略图或头像，效果甚至都不存在。如果这张照片是一个中等大小的正方形(至少300px)，那么效果就不一样了。选择使用这样一幅巨大的马克友好的脸是一个很好的选择;这个设计不仅提供了人性化的设计元素，而且还具有创造性。没有这张照片，就不会有个人对用户的影响。如果没有这个具体的布局，这部分将会有完全不同的情感效果。
下一个示例的独特布局解决方案与动画有关。如果你看一下UX流的主页，并向下滚动一点，你可能会注意到其中一个部分的背景是动画的。老实说没什么新奇的，但它是独一无二的。当你在网页上滚动时，背景并不容易。如果说有什么不同的话，那就是在过去的几年里，我们看到了不同的元素在一个区域内，在你滚动的时候。但是，除了视差之外，我似乎没有太多的背景动画。这很重要的原因是背景定义了一个部分。而且，虽然这不是什么疯狂的动画，但它仍然令人印象深刻。
并不是所有的事情都需要大胆、响亮、令人讨厌，让人印象深刻。有时候，一些细微的东西，比如一个小的、快速的动作，就足以为用户产生一种独特的体验。这绝对是其中之一。另一个重要的注意事项是，动画发生的部分本身没有独特的布局。没关系;当你从一个部分到下一个部分的时候，这个过渡是很明显的，它仍然是布局的一部分，即使它不是动画的结束布局。
Ted Todd网站的视觉设计和整体用户体验设计得很好。为了这篇文章，我想谈谈Ted Todd在他们的网站上使用位置和地图部分的方式。在他们的主页的底部，有一个区域指定的不同的办公地点公司在整个佛罗里达。这一节令人惊叹的原因有很多。首先，该部分以一种独特的方式使用布局来提供一流的设计解决方案。最值得注意的是佛罗里达向右的灯光形状。佛罗里达的视觉上有很多点，是展示公司影响力的绝佳方式。他们不只是说他们在佛罗里达，设计告诉你确切的地点。这是一种很容易理解的视觉，它也以一种奇妙的方式被执行。
关于这部分的下一个重要的事情是点。他们实际上是互动的。当你在他们上空盘旋时，你会得到城镇的名字，或者是泰德·托德保险公司的所在地。但是，如果你点击它，整个部分就会转移，为具体办公室的细节腾出空间。你会得到办公室的电话号码、地址、办公时间，还有一份员工名单。我喜欢这个设计方案，因为它允许用户快速导航到他们附近的位置。在视觉上，这比信息在页面标题上堆叠在一起更有趣，更独特，你不觉得吗?
3
s后返回登录
3
s后返回登录
