-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
206 lines (206 loc) · 7.08 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>TheDesignProject</title>
<link rel="stylesheet" href="assets/css/style.css" />
</head>
<body>
<header id="header">
<div>
<h1>TheDesignProject</h1>
<p>by a WebDesigner</p>
<div>
<h2>How to become a better designer?</h2>
<p>
A challenge to improve your product design skills by solving
problems in your daily life.<img
src="assets/img/rocket.png"
alt="Rocket"
/>
</p>
<p>SCROLL TO SEE MORE —</p>
</div>
</div>
<div>
<img src="assets/img/ilustracion1.png" alt="Background1" />
<img src="assets/img/ilustracion_people.png" alt="Background2" />
</div>
</header>
<section id="logo">
<img src="assets/img/logo.svg" alt="Logo" />
</section>
<section id="section">
<img src="assets/img/images.jpg" alt="Designs" />
</section>
<main id="main">
<section>
<div>
<h3>
Every idea <img src="assets/img/idea.png" alt="Lightbulb" /> starts
with a need
</h3>
<p>
Earlier this year (January 2018). I started to think about how I
could improve my design skills and attract more customers. I wanted
to start designing some ideas that for a long time I had only on
paper and stored on my cell phone, I decided to look for some
challenge, something that makes more sense with what I thought. I
saw that many designers (especially in dribbble) made a daily user
interface, I really liked the idea, but the problem was that the
result was just something nice and did not solve any problem.
</p>
</div>
<div>
<h3>
After several weeks of sticking to this challenge, I learned a lot
</h3>
<div>
<article>
<img src="assets/img/title02.svg" alt="icon" />
<div>
<h4>Start with asking why</h4>
<p>
You will start seeing things differently and coming up with
more effective ways of achieving goals.
</p>
</div>
</article>
<article>
<img src="assets/img/title04.svg" alt="icon" />
<div>
<h4>Your ideas will have more value</h4>
<p>
By looking at problems from a different perspective, your
ideas will be fresher and more valuable.
</p>
</div>
</article>
<article>
<img src="assets/img/title01.svg" alt="icon" />
<div>
<h4>Design solutions with love</h4>
<p>
Only when you experience a problem yourself do you understand
the frustration of the users and resolve to end it.
</p>
</div>
</article>
<article>
<img src="assets/img/title03.svg" alt="icon" />
<div>
<h4>Share and show your work</h4>
<p>
As designers, we are often afraid of showing work that’s not
finished or doesn’t look perfect. You will learn to accept
feedback and learn from it.
</p>
</div>
</article>
</div>
</div>
</section>
<section>
<div>
<h3>Are you ready? Let’s go!!</h3>
<p>
The challenge lasts 30 days. On each of those days you will have to
create a solution to any problem you yourself are facing and show
the result to the community.
</p>
</div>
<div>
<article>
<div>
<img src="assets/img/step01.png" alt="People" />
</div>
<div>
<h5>01</h5>
<img src="assets/img/step01.svg" alt="Eyes" />
<h4>Find your problem</h4>
<p>
It has to be a problem that’s personally affecting or affected
you, like finding your keys, calling a taxi or even remembering
something. Open your eyes, look around you carefully and pay
close attention to your surroundings.
</p>
</div>
</article>
<article>
<div>
<h5>02</h5>
<img src="assets/img/step02.svg" alt="Writing" />
<h4>Think about the solution</h4>
<p>
It's time to look for solutions. What can you do to solve these
problems? It's time to think out of the box, grab your notebook
and start writing down all the ideas that come to mind.
</p>
</div>
<div>
<img src="assets/img/step02.png" alt="People" />
</div>
</article>
<article>
<div>
<img src="assets/img/step03.png" alt="People" />
</div>
<div>
<h5>03</h5>
<img src="assets/img/step03.svg" alt="MenWithMac" />
<h4>Design your proposal</h4>
<p>
How can design help solve your problem? It's time to think about
features and functionality, and then start designing. Don’t
forget to always ask yourself: Would I actually use this?
</p>
</div>
</article>
<article>
<div>
<h5>04</h5>
<img src="assets/img/step04.svg" alt="Surfer" />
<h4>Share your work</h4>
<p>
Share your design on instagram or dribbble with the hashtag
#thedesignproject Remember to explain what the problem was, how
you came up with the solution and how the design achieves it.
Find out what people have to say about it.
</p>
</div>
<div>
<img src="assets/img/step04.png" alt="People" />
</div>
</article>
</div>
</section>
</main>
<footer id="footer">
<div>
<h3>Do you like this challenge?</h3>
<p>
Subscribe to be the first to hear about updates, tips and
recommendations!
</p>
<form>
<input
type="email"
name="email"
id="email"
placeholder="Write your email here"
required
/>
<input type="submit" value="Subscribe" />
</form>
</div>
<div>
<p>
Created with Love by a Webdesigner
<img src="assets/img/love.png" alt="Heart" />
</p>
</div>
</footer>
</body>
</html>