[et_pb_section fb_built=”1″ fullwidth=”on” _builder_version=”3.1.1″ custom_padding=”0|0px|0px|0px”][et_pb_fullwidth_post_title meta=”off” featured_image=”off” _builder_version=”3.1.1″ title_font=”||||||||” title_text_align=”center” title_font_size=”48px”][/et_pb_fullwidth_post_title][/et_pb_section][et_pb_section fb_built=”1″ _builder_version=”3.0.47″ custom_padding=”0|0px|54px|0px”][et_pb_row custom_padding=”27px|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
PROJECT OVERVIEW
Short summary for website project
[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”0|0px|32.8594px|0px” _builder_version=”3.0.47″ background_size=”initial” background_position=”top_left” background_repeat=”repeat”][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][et_pb_text _builder_version=”3.1.1″]
For this project, I designed a news website for genetic researchers. Goal for the site was to enable visitors to search for and find information about specific topics related to genetic research. I gad to ensure that busy professionals who visit my site can search for, and easily find, specific information; and that the typography I employed is both easy to read and aesthetically pleasing. In this project I showed my skills in working with heavy information and a lot of text.
I planned to research fonts and font sizes that work best with heavy amount of text. This project helped me see how a scientific website can be at the same time informational but also pleasing for the visitors to read.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”0|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Research
Information Architecture
[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
What is Information Architecture?
A good IA helps people to understand their surroundings and find what they’re looking for in the real world as well as online. Practicing information architecture involves facilitating the people and organizations we work with to consider their structures and language thoughtfully. Information architecture is the practice of deciding how to arrange the parts of something to be understandable.
If you’ve ever tried to use something and thought, “where am I supposed to go next?” or “this doesn’t make any sense,” you are encountering an issue with an information architecture.
Information Architecture Forms A Foundation for User Experience Design
Many people are curious how IA is related to user experience (UX) design. UX designers practice IA everyday; the two are closely connected. Put simply, IA is an important skill within UX and other disciplines, such as content strategy, tech- nical writing, library science and interaction design.
Information Architectures Are All Around Us
Information architectures (IAs) are in the websites we use, the apps and software we down- load, the printed materials we encounter, and even the physical places we spend time in.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Typography on the Web
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
What is typography?
Put simply, it is the art, design, and arrangement of text (re- ferred to as type)—a concept borrowed from traditional print design. It is as much about what you don’t do with your type as what you do. On the web, typography often gets very little attention, and there are certain technological limitations that can cause web typography to suffer when compared to print typography. However, with the tools available to you, there’s no reason why type cannot be presented on the web in a wide variety of stylish and beautiful forms.
How is typography done on the web?
How is typography done on the web?
Typography on the web is controlled entirely with CSS, and by using CSS you gain a lot of control: not just over the size, color and typeface selection but also over the line height, the letter spacing, the level of capitalization (all caps, initial caps, small-caps or no capitalization at all) and even control over how the first letter or first line of your text is styled.
By styling the text’s containing block, you also have control over the level of justification of the text and the line length. Not only that, you also only have to create your style rules in one location—your stylesheet—to have those rules apply to all of your text, across your whole website (or you can be specific and target particular paragraphs, or areas on the page). Furthermore, if you ever find yourself needing to increase your website text size, or change the body font, you only have to change the value in your stylesheet.
Limitations of typography
Traditional print designers have a huge amount of options available to them when it comes to typography, including the sheer numbers of fonts available, and options for positioning text. Typography on the web is a lot more limited, because we must design using fonts and positioning, etc that we know will be available on the computers of the users that will look at their web sites—it is no use just designing for yourself on the web!
Limitations of web typography include:
– A reduced selection of fonts.
– No hyphenation, making full justification look ugly when a column of text gets narrow.
– Poor control over kerning (ie, the spacing between the let- ters).
– A lack of control over how the work is viewed—designers must account for a wide variety of screen sizes, resolutions and environments.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Good Website Examples
[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Why effective?
Story collage – The home page begins with a big, colorful jigsaw puzzle of lead- ing stories’ headlines, providing a glimpse into the articles they link to, as well as a strong visual draw for the eye.
Thumbnail sliders – At certain points, the pages are broken up by a useful carousel of image thumbnails, each allowing the user to drill into a specific story.
You Need To Read This Now – By giving its top stories a bit of white space and ac- companying them with an explicit direc- tive, The Verge is able to focus attention on the hottest news it has to offer.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
Why effective?
Clean, organized grid – The clean, sharp lines and rigid layout of this design maintains an orderly feel to this site, which keeps it from feeling disorganized or difficult to navigate
User-adjustable layout – USAToday offers visitors the choice between a List or Grid view of their top stories. This allows users to con- trol how much they take on at once – allowing them to effectively choose their preferred ap- proach to browsing the content.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
Why effective?
Masonry – The New Yorker’s home page echoes the trend of the cascading, tiled con- tent block layout that keeps the user scrolling down, scanning for items of interest.
Variety – There are a wide range of image sizes on offer in this layout, which prevents monotony setting in while browsing through.
Minimalism – The overall aesthetic here is clean, structured, and minimalist that lets the content speak, while using the New Yorker’s signature font throughout.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
Why effective?
Readability – Clear type, and comfortable column widths keep things simple and easy to read.
Consistent typography – All headlines, quotes and other text content elements are cohesive across the sprawl of this site.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
Why effective?
Whitespace – Being a newspaper, by far the most important content is the text, meaning that careful attention has been paid to ensur- ing a pleasurable reading experience
Visual hierarchy – Articles with an image are more attractive – and therefore more important – than those without. This rule is further em- phasized by the size of the accompanying im- age, with the leading story having significantly more space devoted to it.
Hidden content – The leading stories in each news category are smartly hidden in the me- ga-menu, which is revealed on hover.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Bad Website Examples
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
Why not effective?
This Florida-based company might have a site design that’s stuck in the past, but they’ve also decided that the best way to encourage user engagement is to completely bombard them with information on the homepage. A few small, low quality images are scattered throughout the page, but nothing to break up the large amount of text.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
Why not effective?
Looking a bit like an early web version of the Argos catalogue, this site is genuinely baffling. Scroll down and you’ll continue to see more of the same cut-and-pasted low quality images with links. There’s a search box at the top that’s handy – providing you’ve got some idea of what you’re looking for…
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
Why not effective?
For decades, James Bond has been gracing the silver screen as a charismatic, charming and ultra-slick secret agent. Yet, the website for the James Bond museum, with its stark background and Times New Roman typeface is a little under whelming. Barely echoing the character of Bond himself, the home page is a sour shaken and stirred cocktail of menus, hyperlinks and random imagery.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”2_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Typefaces
Typefaces for heavy content websites
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
Every website that includes some content will use paragraphs. Whether they’re only 1-sentence long or written as blocks of text that span the entire page – paragraphs are important. But honestly please don’t write illegible blocks of text because even the Devil himself will cringe.
Formatting is crucial to well-structured paragraphs. But formatting is generated by the style, spacing, and position of typography. For example it’s generally wise to err on the side of larger text rather than smaller. Likewise it’s a good idea to increase paragraph line heights instead of keep- ing every line tucked close together.
Anywhere from 2x-5x the line height between each paragraph is a sturdy margin number. A safe bottom margin on medium-sized paragraph text would be 15px-20px. If you want to have space that naturally resizes go for a value in ems.
When it comes to the font choice many designers feel that sans-serif fonts are easier to read on the web.
Serif fonts won’t present a problem, so long as they’re sized properly. Paragraph font choice really depends on the type of website.
A lot of online magazines and news blogs will stick to serif fonts as a means of duplicating the style of real- world newspapers. But the vast majority of websites from companies to portfolios and forums will use sans-serif. Just find whatever font works best for each project.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_3″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/main-qimg-aba9ec2fb450a2b2f18a904d81378f23.png” _builder_version=”3.1.1″][/et_pb_image][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/helvetica-is-art.jpg” _builder_version=”3.1.1″ max_width=”62%”][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Brainstorming
Sketches
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Portable-Network-Graphics-image-F436D156668F-1.png” _builder_version=”3.1.1″][/et_pb_image][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Portable-Network-Graphics-image-3FBD643D385E-1.png” _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Portable-Network-Graphics-image-5F1A48031443-1.png” _builder_version=”3.1.1″][/et_pb_image][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Portable-Network-Graphics-image-DCFE05E5B14E-1.png” _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Portable-Network-Graphics-image-28ED389E918E-1.png” _builder_version=”3.1.1″][/et_pb_image][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Portable-Network-Graphics-image-F81A0FBFE5C1-1.png” _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Portable-Network-Graphics-image-844E8BFB4B5C-1.png” _builder_version=”3.1.1″][/et_pb_image][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Portable-Network-Graphics-image-A8C7C6F6728B-1.png” _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Wireframes
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|25px|0px” _builder_version=”3.1.1″][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Home.png” _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/News-with-account.png” _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Research.png” _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Account-details.png” _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Flowchart
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”20px|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″ src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Flowchart-1.png”][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row _builder_version=”3.1.1″ custom_padding=”0|0px|27px|0px”][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
USABILITY TESTING
Scenarios
[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”0|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Create an account that will be associated with this site so that you can post genetic researches posts and comment on existed ones.
Find a research on “Mutations in the gene encoding” using the search bar and read the whole article.
Subscribe for new researches using user account.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Screen-Shot-2018-08-11-at-5.56.07-PM.png” _builder_version=”3.1.1″ max_width=”0%”][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”33px|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Paper prototype results
[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”0|0px|33px|0px” _builder_version=”3.1.1″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Creating an account was a pretty simple thing to do because of a very familiar process that is done on any other websites. No changes has been made here.
No immediate complications have been found while trying to search for a specific topic. The search bard is visible on every page and can be very found easily enough. No recommendations have been provided.
This step took some time to complete, because the initial idea was that after the account has been cre- ated it automatically would take the user to the same page. Suggestion was provided to open “My Account” page after registration has been completed.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/IMG_6486.jpg” _builder_version=”3.1.1″ max_width=”76%”][/et_pb_image][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”33px|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Digital prototype results
[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”0|0px|33px|0px” _builder_version=”3.1.1″][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
This user test helped me get rid of extra information on the home page. The user has expressed that the home page is a little bit too crowded and has too much on it. It was hard for the user to concentrate on one thing and find a rhythm. I got rid of the slider and only kept the 3 newest articles.
During this user test I asked the user to play around with video segments. As a result of feedback that I received, I got rid of the extra information on the video segments part on the home page.
[/et_pb_text][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Home-Page.jpg” _builder_version=”3.1.1″ max_width=”87%”][/et_pb_image][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image _builder_version=”3.1.1″ src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Segment-Watch.jpg”][/et_pb_image][/et_pb_column][et_pb_column type=”1_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”33px|0px|0|0px” _builder_version=”3.1.1″][et_pb_column type=”4_4″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
CONCLUSION
[/et_pb_text][/et_pb_column][/et_pb_row][et_pb_row custom_padding=”0|0px|33px|0px” _builder_version=”3.1.1″][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_text _builder_version=”3.1.1″]
Results
This was a very fun project during which I’ve learned a lot. I’ve been able to create a website design from scratch, come up with interaction throughout website and even create content. The most important lesson that I learned from this work is how to work with heavy content websites content. It was interesting to explore how fonts work and how much it makes the whole website. I also learned that there are so many little details that a web designer have to go through in order to get a really good website. I’ve also been able to perfect my skills in 2 apps that I now use for UI design on daily basis. These apps are Sketch and InVision. I also realized that the more simple you make the site the easier it is to use and design.
[/et_pb_text][et_pb_text _builder_version=”3.1.1″]
Interactive prototype can be found at this link:
[/et_pb_text][/et_pb_column][et_pb_column type=”1_2″ _builder_version=”3.0.47″ parallax=”off” parallax_method=”on”][et_pb_image src=”https://www.balashoffs.com/wp-content/uploads/2018/08/Home-Pagecropped.jpg” align=”center” _builder_version=”3.1.1″ max_width_tablet=”24%” max_width_last_edited=”on|desktop” module_alignment=”center”][/et_pb_image][/et_pb_column][/et_pb_row][/et_pb_section]
