How I visualize every project before writing code.
Admittedly I am a visual leaner , perhaps this is because of my background in photography . Before starting any project I like to visualize how I want it to look, the feel am going for and how I want you the user to experience it .
I then think what functionalities I want to implement, is it visually appealing is it easy to use , can I keep the user engaged and would a user want to revisit! . Which brings me to how I outline every project before coding starts .
I like using google slide presentation to outline every step .
Let’s get started ask yourself What am trying to build ? Who is this for? everyone of course ! , I started using google slide presentation from my Mod 2 project and realized how much it helped me figure out what to edit and what I needed to do .
With my Mod three project I had a partner, so I had to think about what could we do , we decided on an Ice cream shop, where a user can order from unique flavors , Toppings , Scoops , like and leave a review.
I didn’t want it to be just another ordinary ice cream shop . I wanted this ice cream app to offer unusual flavor profiles and have a tasty selection of toppings . I thought that having a retro feel, but a cool clean layout would be welcoming . I started working on the layout , In my first slide . I started thinking of a name and theme with color font-, font family I wanted , how many models we should have , we started with four and additional models were added later , hey things change ! gotta learn to go with it . In the thinking stages I often think what would be a catchy name and what color should it be , would it be pleasing to the eye , and sound yummy ? My first slides are me going through my thought process , for names models, what would be on offer , reviews etc…
After settling on the Font a background color and positioning of where things should be on the page , I then started thinking about , the details . Should it be a nav-bar do we want drop down scroll or checkbox? if we wanted cups size or scoops , what kind of toppings .. what would make this different from what you have seen before . Try and figure out what will and wont work and of course how to code it “do not make it difficult for yourself “ . Think can I do this ? how long will this take and will it work?
Every step is a learning process , implementing some changes and deciding what might be more realistic to “code “ you start to rethink the layout , but not the idea . After editing the menu I want to visualize what it might look like with some changes , and more details with the font colors and font family .
The next step would be after a flavor is selected what happens , “we decide it should be a pop up photo of that selected flavor , see next slide .
after selecting your flavor toppings what else , can we work on what might the user want perhaps a login? signup? Reviews !!? if you create a review can you delete it , if you have a login /sign up why how would that look would you require a password?
In the end we decided on not creating a login/signup , just reviews where you can see many reviews and you can leave one and also delete it This Photo was a first daft of the overall layout , which I liked but thought it looked too generic and wanted something that spoke more about what I would like to see .
initially , I thought it would look great a more cleaner look , but after working on the styling ,I thought it needed to pop more on the page and thought about what a class mate said about how websites are all starting to look and feel the same way. I know I wanted it to look more creative and fun and have a unique look and feel ., So in the end I went with what I thought would work best I changed the background photo, but not the concept or intention .
Have fun with your projects plan out your thoughts and use google slides to plan out your project , edit alone the way . have fun !
thee end ….
