2. Description
The website is a portfolio showing the works in the different fields. As a young desinger’s personal site it pays a lot
of attention not only to showing the works but stating the design approach and objectives for the further career. Usu-
ally designers have dilemma between presenting their own individual style graphically and showing the works which
are made for the different clients in the best way.
Here the graphic design is still simple, not interrupting the perception of various works, but designer’s personality is
shown in the structure and concept. The website goes beyond usual design with just the works gallery to give more
individual perspective. That’s why it is built around the question “Why be designing?” unfolding the narrative and
giving the answers to the different aspects of the main question. Works are shown as the results of the thinking pro-
cess. In this way they appear to be conceptually well grounded and smoothly follow the main idea.
Brief
The website’s niche can be described as the “Reputation Building Portfolio” which focuses on building name in the
industry and online. This can be imagined as a form of an artist’s showcase. So the main audience are the designers
as well and clients with understanding of the field. That’s why the design is chosen to be not the conservative one
with the works’ thumbnails gallery, but to be a bit outstanding of usual portfolio sites.
The material is still structured in an appropriate way with the division for categories and items in them. But items are
shown in high resolution images which load at once to make navigation seamless without poping-up images.
The horizontal scrolling is chosen first of all to follow the narrative, but also to make transitions between images of
one item more sleek and to get more natural experience while browsing (especially for the service design part, where
pages from booklets are supposed to be shown). Also as the website tries to render different approach to the portfo-
lio site the difference in scrolling must not seem inappropriate as it could be in some other cases.
Overall style is chosen to be very minimalistic because it must not interfere with the works shown, considering the
branding and different graphic solutions of various works.
5. Site map
“Categories” is a part of the main page
which appears later using Java Script
Homepage Categories’ list
Products Services Interactivity Environment
About me
Item Item Item Item Item Item Item Item Item Item Item Item
6. Wireframes
The answer appears after mouse activity is detected
Why be designing?
General answer: Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Donec sed orci ac urna vehicula venenatis quis
vitae lorem. Donec turpis justo, faucibus et feugiat non, pulvinar
at ligula. In interdum aliquet erat eget accumsan. Fusce vitae
augue lorem, ac lacinia nisl.
Logo Homepage About me + contacts Shortcut???
Home Page
7. Wireframes
Categories appear with mouse hover
Why be designing category?
category
category
category
Category answer: Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Donec sed orci ac urna vehicula venenatis quis vitae lorem. Donec turpis justo,
faucibus et feugiat non, pulvinar at ligula. In interdum aliquet erat eget
accumsan. Fusce vitae augue lorem, ac lacinia nisl.
Logo Homepage About me + contacts Shortcut???
Home Page
8. Wireframes
Why be designing category? item
category item
category item Description appears with mouse hover
category item
Item Name. Item description (why it was designed): Lorem ipsum
dolor sit amet, consectetur adipiscing elit. Donec sed orci ac urna vehicula
venenatis quis vitae lorem. Donec turpis justo, faucibus et feugiat non,
pulvinar at ligula. In interdum aliquet erat eget accumsan. Fusce vitae
augue lorem, ac lacinia nisl.
Logo Homepage About me + contacts Shortcut???
Categories
9. Wireframes
Why be designing category? item
category item
category item
category item
Item Name. Item description (why it was designed): Lorem ipsum dolor sit amet, consectetur
adipiscing elit. Donec sed orci ac urna vehicula venenatis quis vitae lorem. Donec turpis justo, faucibus
et feugiat non, pulvinar at ligula. In interdum aliquet erat eget accumsan. Fusce vitae augue lorem, ac
lacinia nisl.
Logo Homepage About me + contacts Shortcut???
Item page
10. Wireframes
Yulia Besplemennova Designing
My story: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Contacts:
Donec sed orci ac urna vehicula venenatis quis vitae lorem. Donec turpis email
justo, faucibus et feugiat non, pulvinar at ligula. In interdum aliquet erat phone
eget accumsan. Current location
Fusce vitae augue lorem, ac lacinia nisl. Vivamus tempor hendrerit turpis my interactive tinkering blog
eget faucibus. Donec pharetra, est sit amet tempus lacinia, tellus urna my interactive bookmarks blog
interdum eros, ut varius leo nibh ac nibh. Proin elementum rhoncus my russian language blog
malesuada.
Duis facilisis, arcu sit amet blandit lobortis, lectus magna ultrices metus,
vel pulvinar dolor ipsum sit amet ligula. Pellentesque viverra sagittis neque
id ullamcorper. Maecenas suscipit ullamcorper tortor, ut cursus nisl
condimentum sed. Maecenas accumsan nulla vitae felis porttitor at
blandit metus aliquet. Ut blandit tortor ut mauris
Logo Homepage About me + contacts Shortcut???
About + contacts page
11. Design Mockups
- Why be designing?
Y B D Home About Works
Homepage Responsive logo: Yulia Besplemennova D esigning
12. Design Mockups
- Why be designing?
- I am designing because it will save the world Donec turpis justo,
faucibus et feugiat non, pulvinar at ligula. In interdum aliquet
erat eget accumsan. Fusce vitae augue lorem, ac lacinia nisl.
Y B D Home About Works
Homepage
13. Design Mockups
- Why be designing products?
services
interactivity
environment
- Designing products is important as they surround us everyday.
Donec turpis justo, faucibus et feugiat non, pulvinar at ligula.
In interdum aliquet erat eget accumsan. Fusce vitae augue
lorem, ac lacinia nisl.
Y B D Home About Works
Categories
14. Design Mockups
- Why be designing products: a kitchen
services a chair?
interactivity a robot
environment a hanger
a hardometer
- Flecti is an unusual chair... Donec turpis justo, faucibus et
feugiat non, pulvinar at ligula. In interdum aliquet erat eget
accumsan. Fusce vitae augue lorem, ac lacinia nisl.
Y B D Home About Works
Item page
15. Design Mockups
Yulia Besplemennova
My story: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec sed orci ac urna ybdesigning@gmail.com
vehicula venenatis quis vitae lorem. Donec turpis justo, faucibus et feugiat non, pulvinar at skype: ybdesigning
ligula. In interdum aliquet erat eget accumsan.
Fusce vitae augue lorem, ac lacinia nisl. Vivamus tempor hendrerit turpis eget faucibus.
Donec pharetra, est sit amet tempus lacinia, tellus urna interdum eros, ut varius leo nibh ac Current lication: Sydney
nibh. Proin elementum rhoncus malesuada. +00000000000
Duis facilisis, arcu sit amet blandit lobortis, lectus magna ultrices metus, vel pulvinar dolor My blogs:
ipsum sit amet ligula. Pellentesque viverra sagittis neque id ullamcorper. Maecenas suscipit interactivestock.tumblr.com
ullamcorper tortor, ut cursus nisl condimentum sed. Maecenas accumsan nulla vitae felis inobjects.tumblr.com
porttitor at blandit metus aliquet. Ut blandit tortor ut mauris
hihickster.livejournal.com
Also:
Y B D Home About Works
About me
