Web design idea presentation
0 likes459 views
The document describes a portfolio website created by designer Yulia Besplemennova. The website goes beyond a typical design portfolio by unfolding a narrative around the question "Why be designing?". Works are presented as results of the designer's thinking process. The minimalist graphic design does not interfere with presenting works done for different clients. The portfolio aims to build the designer's reputation in the industry through an artist's showcase-style presentation of works. Navigation utilizes horizontal scrolling to seamlessly view high resolution images and create a natural browsing experience.
Web design idea presentation
- 1. SDES3174 Assignment 2 Why be designing? Portfolio website by Y ulia B esplemennova (z3406397)
- 2. Description The website is a portfolio showing the works in the different fields. As a young desingers 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 designers personality is shown in the structure and concept. The website goes beyond usual design with just the works gallery to give more individual perspective. Thats 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 websites 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 artists showcase. So the main audience are the designers as well and clients with understanding of the field. Thats 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.
- 3. Research Traditional grid-structured portfolio websites.
- 4. Research Selected graphic style examples Horizontal scroll examples
- 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