An interesting syndrome that I read about was called "idea-to-idea syndrome." which is when a designer starts sketching a new idea before they have finished the one they were working on. It is recommended to sketch out completely each idea and not to puddle jump. Other techniques that were talked about to partake in in the planning process are: brainstorming, brainwriting (write an idea and then the next team member writes builds on it), thesaurus browsing, mind-mapping (tree diagram that shows words, tasks, concepts or sub-concepts related to central idea), gap filling (identifying two points, a starting and an end point and closing the gap between them), boxing gloves ("sketch every webpage on its own sticky note and then draw a single user journey through all the notes."), sketchboarding( "gather all the work related to a project together in one place, usually on a large paper canvas pinned to a wall... the goal of a sketchboard is to expose problems and suggest ideas allowing everyone to see them comment on them and suggest improvements), sketching notations ( "notation is a language that visualizes states of interface, user actions and events"), and storyboards ("help designers present complex ideas simply and give the concepts practical focus and context early on in the process."). I found it interesting that they suggest to partake in these processes with market since with pencil you are too likely to erase and obsess over little details, where markers you are more likely to focus on the substance of the idea. The book sums up the point of wireframing in three main ideas: "1)page structure, showing how the information is organized on the page, what users see and what they can do. 2)navigation indicating how users can move around the website, where they are currently and where they can go next. 3) interaction details, indicating what happens when the user does something, the consequences of their actions and their next steps to achieving their goals." There are several types of wireframes: low-fidelity, high fidelity, hybrid and sketchy. I'll go into detail a bit about what each of those mean. low-fidelity wireframes are high level structure frames that show the hierachy and interaction. Minimum detail, gray boxes with labels describing what each are, ex header navigation menu, footer etc. High fidelity wireframes are much more detailed and basically show how a design works. Hybrid wireframes basically fall in the middle between low and high fidelity wireframes. shows high-level structure while highlighting details of certain parts of the page while just simply sketching other parts. Sketchy wireframes they are digital sketches that designers make using a program on the computer. They said that digital sketching should not replace the initial hand drawn sketch stage. Keep an eye for my next blog post for some more pre-coding suggestions!
Sunday, April 24, 2011
Practicum 6 Christina Kalsow- Ramos
I have been doing more research on planning and implementing design since i have found the hardest part of this project creating an idea and sticking with it. I definitely could have avoided unnecessary coding if I would have planned out better initially what I wanted to create. Here are my findings on steps on should take before actually coding a website: start with research: aka finding out context of project, users, business requirements, constrains,, then go on to wireframing which will help pan out all of the ideas the designer has floating around in their head. Wireframing would have definitely saved me a lot of unnecessary coding time. What wireframing basically entails is sketching out all the ideas and in the end rejecting the bad ones. "The purpose of sketching is not to identify a solution but rather to explore as many ideas and alternatives as possible... the more ideas you make visible at this point, the easier it will be to see advantages of the better ones and dismiss the bad ones as you move along." (the photo is an example from the book I was reading on wireframing). 
An interesting syndrome that I read about was called "idea-to-idea syndrome." which is when a designer starts sketching a new idea before they have finished the one they were working on. It is recommended to sketch out completely each idea and not to puddle jump. Other techniques that were talked about to partake in in the planning process are: brainstorming, brainwriting (write an idea and then the next team member writes builds on it), thesaurus browsing, mind-mapping (tree diagram that shows words, tasks, concepts or sub-concepts related to central idea), gap filling (identifying two points, a starting and an end point and closing the gap between them), boxing gloves ("sketch every webpage on its own sticky note and then draw a single user journey through all the notes."), sketchboarding( "gather all the work related to a project together in one place, usually on a large paper canvas pinned to a wall... the goal of a sketchboard is to expose problems and suggest ideas allowing everyone to see them comment on them and suggest improvements), sketching notations ( "notation is a language that visualizes states of interface, user actions and events"), and storyboards ("help designers present complex ideas simply and give the concepts practical focus and context early on in the process."). I found it interesting that they suggest to partake in these processes with market since with pencil you are too likely to erase and obsess over little details, where markers you are more likely to focus on the substance of the idea. The book sums up the point of wireframing in three main ideas: "1)page structure, showing how the information is organized on the page, what users see and what they can do. 2)navigation indicating how users can move around the website, where they are currently and where they can go next. 3) interaction details, indicating what happens when the user does something, the consequences of their actions and their next steps to achieving their goals." There are several types of wireframes: low-fidelity, high fidelity, hybrid and sketchy. I'll go into detail a bit about what each of those mean. low-fidelity wireframes are high level structure frames that show the hierachy and interaction. Minimum detail, gray boxes with labels describing what each are, ex header navigation menu, footer etc. High fidelity wireframes are much more detailed and basically show how a design works. Hybrid wireframes basically fall in the middle between low and high fidelity wireframes. shows high-level structure while highlighting details of certain parts of the page while just simply sketching other parts. Sketchy wireframes they are digital sketches that designers make using a program on the computer. They said that digital sketching should not replace the initial hand drawn sketch stage. Keep an eye for my next blog post for some more pre-coding suggestions!
An interesting syndrome that I read about was called "idea-to-idea syndrome." which is when a designer starts sketching a new idea before they have finished the one they were working on. It is recommended to sketch out completely each idea and not to puddle jump. Other techniques that were talked about to partake in in the planning process are: brainstorming, brainwriting (write an idea and then the next team member writes builds on it), thesaurus browsing, mind-mapping (tree diagram that shows words, tasks, concepts or sub-concepts related to central idea), gap filling (identifying two points, a starting and an end point and closing the gap between them), boxing gloves ("sketch every webpage on its own sticky note and then draw a single user journey through all the notes."), sketchboarding( "gather all the work related to a project together in one place, usually on a large paper canvas pinned to a wall... the goal of a sketchboard is to expose problems and suggest ideas allowing everyone to see them comment on them and suggest improvements), sketching notations ( "notation is a language that visualizes states of interface, user actions and events"), and storyboards ("help designers present complex ideas simply and give the concepts practical focus and context early on in the process."). I found it interesting that they suggest to partake in these processes with market since with pencil you are too likely to erase and obsess over little details, where markers you are more likely to focus on the substance of the idea. The book sums up the point of wireframing in three main ideas: "1)page structure, showing how the information is organized on the page, what users see and what they can do. 2)navigation indicating how users can move around the website, where they are currently and where they can go next. 3) interaction details, indicating what happens when the user does something, the consequences of their actions and their next steps to achieving their goals." There are several types of wireframes: low-fidelity, high fidelity, hybrid and sketchy. I'll go into detail a bit about what each of those mean. low-fidelity wireframes are high level structure frames that show the hierachy and interaction. Minimum detail, gray boxes with labels describing what each are, ex header navigation menu, footer etc. High fidelity wireframes are much more detailed and basically show how a design works. Hybrid wireframes basically fall in the middle between low and high fidelity wireframes. shows high-level structure while highlighting details of certain parts of the page while just simply sketching other parts. Sketchy wireframes they are digital sketches that designers make using a program on the computer. They said that digital sketching should not replace the initial hand drawn sketch stage. Keep an eye for my next blog post for some more pre-coding suggestions!
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment