Tuesday, 14 October 2014

With my artists chosen but yet to be separated, and my research on other sites and events nearing completion i feel i can begin to wireframe my sites based on what i have found. Also, being that the deadline for planning is in 2 days i think it's about time i start work on it.

I've never been to great at wireframing, and also tend to put more detail than i should into each design, but at the same time i feel it really cements the ideas i have in my head, especially when working on a project i don't even nearly feel comfortable doing. That said, creating wireframes is easiest for me in paper form, working through each section and category necessary for the completion of the brief and my site in order to include all the necessary parts.

My first task was laying and working out where everything would sit within the confines of the pages in a type of flow diagram.


After laying out the necessary things for completion of the brief and my page, the flow diagram became easy to put together and work out how and why each thing would flow onto the next. Also with the addition of a footer i think my navigation bar would be much less cramped.

I again refined my flow diagram, this time focussing on it's use moving forwards towards wire framing. A lot of my site after making a flow diagram seemed like it would contain lots of different galleries and block elements to contain links to corresponding pages.


Pictured above is the wireframe for my home menu, containing my mocked up idea of the navigation bar and a possible sub navigation if i can include that later if i decide it works with the overall theme.
I want the news to be the main feature of the home page, moreso for attracting attention to the major things happeneing, then leading to the info than the other way round. I have decided a gallery view will be more appealing on a usability standpoint purely because pictures can say more than words ever could, and in this way, adding a sub navigation to the left or right hand side of the new gallery, it could be a great way to keep users interested in the up and coming things to the event. Underneath that will be a similar "About" section, just teeing up the about section which will be situated on another page available through a link from the small about section on the homepage. That and smaller news may be situated together with similar features in either a drop down format or a click through page to allow for more reading.
Beneath these things is a gallery type tile window for the events, each will be a click through to the events page, but for the homepage is will contain just the tiles and a small header allowing the user to make up their mind through a clever title and an enticing picture to accompany it.
Below this will be a click through to social media, either allowing the update of a status containing a mention of the event, or just the events page on social media with an immediate prompt to follow or like. This will be followed by contacts and analytics. Further followed by a footer containing the overflow from the navigation, such as a sign up newsletter, blog, FAQ (maybe) and the shop.


Pictures above is the plan of my Event page containing a sub navigation within a gallery to cycle through new additions to the event and event type news. Below is a calendar with a filter for genre, artist and type of skill set. Below that on the wireframe is a calendar in the same vain, followed again by the footer.


The Artist page is again based on the original homepage with the sections set out in the flow diagram. The top section again is the artists gallery revolving showing images that provide click through links to both the artist and the event page in which they will be housed. Below this is breaking news type section containing information about artists, newly added events, new workshops etc.
Below that is the categories section laid out in a similar manner to that of the OFFF site mentioned before.
Again below that is a smaller artists section allowing click through via images as appose to a majority text.

No comments:

Post a Comment