Skip to content

Commit 5f5b2c2

Browse files
committed
Merge pull request #265 from DesignOpen/issue-72
style the design committee article
2 parents 36aef70 + 2daa963 commit 5f5b2c2

File tree

4 files changed

+194
-1
lines changed

4 files changed

+194
-1
lines changed
Lines changed: 169 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,169 @@
1+
---
2+
layout: compress
3+
---
4+
<!DOCTYPE html>
5+
<html lang="en">
6+
<head>
7+
<meta charset="utf-8">
8+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
9+
<meta name="viewport" content="width=device-width, initial-scale=1">
10+
<title>Open Source Design{% if page.title %} | {{ page.title }}{% endif %}</title>
11+
<link rel="shortcut icon" href="/favicon.ico">
12+
<style>
13+
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,800);
14+
#sitebar{background:#000;padding-top:5px;height:36px;text-align:center;-moz-box-sizing:border-box;box-sizing:border-box;position:fixed;width:100%;top:0;z-index:10;}
15+
#sitebar a:hover{background:transparent;}
16+
#sitebar a:hover path{fill:#f5f58f}
17+
*{
18+
border:0;
19+
outline:0;
20+
padding:0;
21+
margin:0;
22+
box-sizing: border-box;
23+
font-family: "Open Sans", sans-serif;
24+
}
25+
26+
section{
27+
width:100%;
28+
max-width: 40rem;
29+
margin:0 auto;
30+
padding:1rem;
31+
line-height: 180%;
32+
}
33+
34+
h2{
35+
padding-top: 1rem;
36+
}
37+
38+
p{
39+
padding-bottom:1rem;
40+
}
41+
42+
a{
43+
color:#5000B4;
44+
}
45+
46+
ol{
47+
margin-left:2rem;
48+
}
49+
50+
blockquote{
51+
font-size: 240%;
52+
font-style: italic;
53+
line-height: 130%;
54+
}
55+
56+
sup, sub {
57+
vertical-align: baseline;
58+
position: relative;
59+
top: -0.4rem;
60+
}
61+
62+
sup a{
63+
font-family: "Courier New", serif;
64+
text-decoration: none;
65+
font-weight: bold;
66+
}
67+
68+
#image {
69+
width: 100%;
70+
height: 200px;
71+
position: relative;
72+
overflow: hidden;
73+
}
74+
#image:before {
75+
background: url('/img/Joint_Session_of_Congress.jpg') no-repeat center bottom;
76+
background-size: cover;
77+
position: fixed;
78+
content: '';
79+
width: 100%;
80+
height: 200px;
81+
will-change: transform;
82+
}
83+
#image svg {
84+
position: absolute;
85+
right: 0;
86+
bottom: 0;
87+
width: 100%;
88+
height: 100%;
89+
will-change: transform;
90+
}
91+
#article {
92+
background: white;
93+
position: relative;
94+
z-index: 2;
95+
}
96+
#article h1 {
97+
max-width: 40rem;
98+
position: relative;
99+
margin: 0 auto;
100+
padding: 0 1rem;
101+
font-size: 3rem;
102+
text-align: right;
103+
top: -60px;
104+
line-height: 3rem;
105+
margin-bottom: -20px;
106+
}
107+
#publishDate {
108+
max-width: 40rem;
109+
padding: 0 1rem;
110+
position: relative;
111+
margin: 0 auto;
112+
}
113+
@media only screen and (min-width: 700px) {
114+
#image {
115+
height: 420px;
116+
}
117+
#image:before {
118+
height: 420px;
119+
}
120+
#image svg {
121+
height: 216px;
122+
}
123+
#article h1 {
124+
top: -100px;
125+
}
126+
}
127+
</style>
128+
<!--[if lt IE 9]>
129+
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
130+
<![endif]-->
131+
</head>
132+
<body itemscope itemtype="http://schema.org/WebPage">
133+
<meta itemscope itemprop="url" content="{{ site.url }}{{ page.url }}">
134+
{% if page.title %}<meta itemscope itemprop="name" content="{{ page.title }}">{% endif %}
135+
<div id="sitebar"><a href="/">
136+
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:a="http://ns.adobe.com/AdobeSVGViewerExtensions/3.0/" x="0px" y="0px" width="25px" height="25px" viewBox="0 0 25 25" xml:space="preserve">
137+
<path fill="#FFF" d="M12.5,10.521c-1.093,0-1.979,0.886-1.979,1.979c0,0.953,0.673,1.747,1.57,1.936V24.99C12.227,24.994,12.363,25,12.5,25 s0.273-0.006,0.409-0.01V14.436c0.896-0.189,1.57-0.984,1.57-1.936C14.479,11.407,13.593,10.521,12.5,10.521z M25,12.5 C25,5.596,19.403,0,12.5,0S0,5.596,0,12.5c0,6.489,4.944,11.821,11.271,12.439l0,0l0-0.002l0,0 c-0.031-5.08-3.094-9.005-4.364-10.415v0c0,0-0.522-0.626-0.226-1.376l2.314-5.869c0,0,0.428-1.085,1.379-1.085H12.5h2.127 c0.951,0,1.379,1.085,1.379,1.085l2.314,5.869c0.296,0.75-0.226,1.376-0.226,1.376v0c-1.271,1.411-4.333,5.335-4.364,10.415l0,0.002 C20.056,24.321,25,18.989,25,12.5z"></path>
138+
</svg></a></div>
139+
<div id="site">
140+
<div id="image">
141+
<svg xmlns="http://www.w3.org/2000/svg" width="216" height="216" viewBox="0 0 216 216" preserveAspectRatio="none">
142+
<path fill="#FFFFFF" d="M216 0L0 216h216"/>
143+
</svg>
144+
</div>
145+
<article id="article" itemscope itemtype=http://schema.org/BlogPosting>
146+
<meta itemprop="description" content="{{ page.excerpt | strip_html}}">
147+
<h1 itemprop="name">Open<br/>Design<br/>is not<br/>Design by<br/>Committee</h1>
148+
<div id="publishDate">Published <time itemprop="datePublished" datetime="{{page.date | date: "%Y-%m-%d" }}">{{page.date | date: "%b %e, %Y" }}</time>
149+
</div>
150+
<section itemprop="articleBody">
151+
{{ content }}
152+
</section>
153+
<div id="author" itemprop="author" itemscope itemtype="http://schema.org/Person">
154+
{% assign author = site.authors[page.author] %}
155+
<header>About the author</header>
156+
<section>
157+
<div id="avatar"><a href="{{author.web}}"><img itemprop="image" src="http://www.gravatar.com/avatar/{{author.gravatar}}?s=160.jpg" alt="{{author.display_name}}" width="80" height="80"></a></div>
158+
<h3><a href="{{author.web}}" itemprop="url"><span itemprop="name">{{author.display_name}}</span></a></h3>
159+
<p class="author_bio">{{author.bio}}</p>
160+
</section>
161+
</div>
162+
{% include post_footer.html %}
163+
{% include comments.html %}
164+
</article>
165+
</div>
166+
<footer></footer>
167+
</body>
168+
{% include analytics.html %}
169+
</html>

articles/_posts/2013-10-31-open-design-is-not-design-by-committee.md

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
---
22
title: "Open Design is not Design by Committee"
3-
layout: post
3+
layout: open-design-is-not-design-by-committee
44
category: articles
55
tags: faq
66
author: garthdb
@@ -16,6 +16,8 @@ For those who are unfamiliar with the term Design By Committee, it is a special
1616

1717
I think some designers have the mistaken idea that open source projects are lawless anarchies, where random contributors haphazardly throw bits and pieces together; forming a version of Frankenstein's monster that hopefully can perform basic tasks. In reality a healthy open source project needs to have an owner, or small group of owners[^1], with a strong sense of where the project is heading. With a core team in place, outside contributors can file issues, submit contributions, and just complain about things they don't like. The core team of owners can then accept or reject the contributions from the community (hopefully in a way that encourages growth and future contributions).
1818

19+
>Instead of being an expert consultant, the designer becomes the tool of the committee members who often have very little design experience
20+
1921
##Ownership is key
2022

2123
The most important difference between Open Source Design and Design by Committee is this concept of ownership. In the context of Design by Committee, usually the designer is a contractor or agency hired by the committee, or underling that is far below the committee members on the org chart. This is the heart of the problem with designing by committee; instead of being an expert consultant, the designer becomes the tool of the committee members who often have very little design experience. It is not unlike giving a formula one racecar to someone without a driver's license; regardless of how well the car can perform, the result will most likely be unremarkable or even disastrous.
@@ -30,6 +32,8 @@ I can't lie and say that it isn't, but community contributions, in the form of i
3032

3133
It can happen. As ideas collide in a discussion, it is possible that contributors will feel the need to move in a different direction than the owner's goals. In an open source project with the right kind of license, the rebelling faction should have the option of forking the project and continuing independently. This is not a great outcome in terms of community development, but it gives an owner with dictatorial tendencies a reason to work with others.
3234

35+
>The Open Source workflow benefits all parties involved
36+
3337
##Why do it?
3438

3539
When implemented correctly, the Open Source workflow benefits all parties involved. Contributors get a chance to collaborate with designers in a more autonomous capacity than most work environments allow, and still receive feedback and encouragement from the project owners. The owners get outside opinions to challenge their assumptions and sometimes they get fantastic contributions worth all the hassle. Most importantly, all the designers involved have the privilege of improving the design community and building something they care about.

img/Joint_Session_of_Congress.jpg

1.14 MB
Loading

npm-debug.log

Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
0 info it worked if it ends with ok
2+
1 verbose cli [ 'node', '/usr/local/bin/npm', 'install' ]
3+
2 info using npm@2.14.0
4+
3 info using node@v0.12.7
5+
4 verbose readDependencies loading dependencies from /Users/matt/repos/designopen.github.io/package.json
6+
5 error install Couldn't read dependencies
7+
6 verbose stack Error: ENOENT, open '/Users/matt/repos/designopen.github.io/package.json'
8+
6 verbose stack at Error (native)
9+
7 verbose cwd /Users/matt/repos/designopen.github.io
10+
8 error Darwin 14.5.0
11+
9 error argv "node" "/usr/local/bin/npm" "install"
12+
10 error node v0.12.7
13+
11 error npm v2.14.0
14+
12 error path /Users/matt/repos/designopen.github.io/package.json
15+
13 error code ENOPACKAGEJSON
16+
14 error errno -2
17+
15 error package.json ENOENT, open '/Users/matt/repos/designopen.github.io/package.json'
18+
15 error package.json This is most likely not a problem with npm itself.
19+
15 error package.json npm can't find a package.json file in your current directory.
20+
16 verbose exit [ -2, true ]

0 commit comments

Comments
 (0)