Transcript: Mellow Yellow Wire frames By: Temi Adefisan Period: Simkanich_ 7 This material, helps inform you about their Background information or History. When a reader is reading the decriptions there will be some keywords links to a similar website Coupons and Ads This is where membership canlogin and get all new discounts way ahead normal customers About and Info This is where the latest news about the Coffee shop is going to be shown and presented . This is where the menus for Breakfast,Lunch , and appetizers are going to be shown Home Page News This is the copyright and the links to the social network These navigational links can also link to other similar websites A logo is usually a very small picture or sign, that represents your company's sign Navigational links to different webpages of the website This is a photo slide of the resturant and what it looks like in the inside and out This webpage and links are only open for members. Members are able to get free discounts and printable coupons These links will show the reader the menu for each course and information about the food Home Page Also if this was a website it will be very eye catching In conclusion I think this will be a great website because it has a very simple web pages and readers will easily get comfortable by using this website. About/Info This is where all the links are for different topics for the news. Like This little image
Transcript: The banners and fonts are just for the purpose of example. Much more work will go into the final ones A concept showcases a ideas for design 4 Now let's add a navigation header! 2. The fullscreen banner changes, and shows you the fullscreen banner for this collection. ElementPragma 2 The goal is to make sure the client likes to concept & direction of the design When the navigation floats on top of the background, this also contributes to a clean and modern look 1. Classic Four elements Let's start with a fullscreen background! 3 1. You put your mouse over a collection Fullscreen backgrounds You put your mouse over Color My World, and this fullscreen banner fades in This is the concept for the collections page. Let me know if you like 4 points above: Fullscreen banners, floating navigation, collections list, and effects. Thanks! Ariel ElementPragma Next important bit: the collections. Let's try a few concepts. 1 2. Now, let's show the collections along with more info on what kind of products the user can expect to find in them You put your mouse over Passion Noir, and this fullscreen banner fades in Collections list Let's illustrate Collection banners & effects Again, these banners are just to illustrate the concept, we'll be working on the banners if this concept is approved This is how the collections page works: For Atlantic, the products will not appear like Orly - we will show all products, not just one, and we have the product description, sizes etc. This example is just to illustrate the faded background concept. 3. Once you click on the white View Collection button for this collection, the fullscreen banner fades out to a very light background, and the products appear over it. See this website for an example of a very faded out background. It gives a very classy effect. Navigation header AtlanticEngraving Website 2015 Concept Notice the faded face of the woman in the background Fullscreen backgrounds give a very modern, clean look to a website
Transcript: page 1 "The start of the app" page 2 "choosing a location" page 3 "Picking a song" The ear protector
Transcript: Login App: Letgo - Existing Flow Step 1 Step 1 Step 2 Step 4 Login Step 2 Open Chats Click on the seller pic in the chat listing itself Step 5 Step 6 Search for the specific chat about that product Open Chats Click on the Seller pic on the product listing App: Letgo - New Flow Click on the review tab and see user reviews Click on the product listing Click on the review tab and see user reviews Step 3 Step 3 Step 4
Transcript: Mahesh K. Thapa Swornim Rajbhandari Using various google tools. Analysis skills Communication and team work Significant content Wireframe THANK YOU!! Wireframing is an architectural blueprint. It helps to define the information hierarchy of a design, making it easier for you to plan the layout according to how you want your user to process the information. Best practices for web design Survey and Feedback forms Evolus pencil Group discussion Team meeting Google site Features Google tools Usability Acceptance Need and demands Web portal design Tools and techniques used for web design What we have learnt Wireframe is a non-graphical representation of a proposed web design. It does not include any colors, graphics and styles. Focuses more on the content and functionality of the web design.
Transcript: Main Tool Site v1 IS Home Page Main Tool Site v1 Trong Dong Brandon Novy Kyle Case Wireframe Review IS Homepage Main Tool Site Tool site Tool Site v1 nnoVation Tool Site v1
Transcript: Wireframe BEHIND THE ZINES HOMEPAGE THE TIMES INTRO VIDEO/AUDIO IMAGE 1 Topic IMAGE 2 TEXT IMAGE 3 Topic IMAGE 1 IMAGE 5 IMAGE 4 TEXT IMAGE 3 Topic SUBTITLE TEXT TOGETHER WE MOVE LARGE QUOTE ABOUT TOGETHER WE MOVE (AUDIO/VIDEO IN BACKGROUND) Topic IMAGE 1 SUBHEADING IMAGE 2 IMAGE 3 Topic IMAGE 5 IMAGE 4 IMAGE 7 IMAGE 6 Topic SUBTITLE IMAGE 8 TEXT 100 DAYS TEXT IMAGE 1 IMAGE 2 Topic TEXT IMAGE 3 IMAGE 4 Topic TEXT IMAGE 5 IMAGE 6 DAY ZERO DAY ZERO TITLE IMAGE 1 IMAGE 3 IMAGE 2 SUBTITLE Topic IMAGE 4 IMAGE 5 TITLE Topic IMAGE 5 IMAGE 6 IMAGE 7 TITLE TEXT TEXT HONEY HONEY BALL LOGO LARGE QUOTE COUCH LOGO Topic CLOUD CLOUD TEXT TEXT CLOUD CLOUD Topic BEES IMAGE TEXT IMAGE BEES
Transcript: Finishes filling profile info Ideas Profile Go to profile - View Shared Ideas -Share an Idea -view profile -View people added in address book Profile -about page -blog page -facebook page -twitter page -contact page -terms/privacy Ideas 2. After log in with existing account Address Book 1. After Create Account Inbox Landing Page 1. Create Account Create with facebook, twitter, linkedin Create standalone account 2. Log in if existing Account forgot password 3. View current members,posted ideas -Change notifications -Deactivate account -View PM Groupify.me Beta Test Prodcut Footer General View interesting ideas in detail Search Result with Members or ideas 3. After viewing members or ideas Settings Navigation Bar
Description: How do you stand out from the stacks of resumes on your prospective employer’s desk? With a Prezi resume template, of course! Create your own “Prezume” and and impress them with your cutting-edge dynamism and cool. All Prezi presentation templates are easy to customize.
Description: If you work in education, make your next report visually interesting and easy to navigate. The line-drawn illustrations in this edu report presentation template encourage curiosity and discovery.
Description: Rise way above the stacks and stacks of two-dimensional paper resumes on the hiring manager’s desk with a Prezi resume template. Simply personalize this Prezi presentation template to create your very own “Prezume” and impress them with your dynamism, originality, and cool.
Description: Stand far above the stacks and stacks of flat, boring resumes on any hiring manager’s desk with a Prezi resume template. Just customize this Prezi presentation template to create your very own “Prezume” and impress them with your dynamism, coolness, and originality.
Now you can make any subject more engaging and memorable