18 May

Web Dev: Project Specific Factors

Every project has different obstacles that need to be planned for and considered. When undertaking this website project for a dance school, it was important to be prepared for the complications surrounding using images of children online.

In this case, every parent whose child’s image is to be used in the project will have to sign a consent form. The project is (as of 20/05/2015) not currently online.

I created the branded consent form below based on this one used by Merton Council.

AnitaGunnConsentFormAlso, I made sure that the code was going to be easy to maintain in the future by adding comments. It was important to my client that she would be able to edit timetable dates at regular intervals, so comments to highlight sections, along with instructions on how to use an FTP client were a real benefit to her.

Screen Shot 2015-05-22 at 13.48.38

 

17 May

Web Dev: Google Map Maker

My research for this project highlighted to me just how much this business relies on location.

Location-based searches are going to be the first port of call for most prospective clients. The best way to ensure this business shows in search is to use the Google Map Maker tool, and to place the dance school on Google Maps.

Unfortunately, within the last week Google Map Maker has been temporarily suspended due to misuse of the tool.

Screen Shot 2015-05-19 at 20.02.59

Screen Shot 2015-05-19 at 20.02.46

When the tool is back up, I will add the business to the map to raise the profile of The Anita Gunn School of Dance.

Until then, I have just added a map to the website so users of the site can find the school with ease, using this Google Developers tutorial. The following shows my code with the specific latitude and longitude of the business.

Google Maps Code

The image below shows how it looks when embedded into the website, after I also added a simple marker using this example code as a guide.

Screen Shot 2015-05-19 at 22.22.01

Screen Shot 2015-05-19 at 22.20.46

 

23 Mar

Portfolio Project: Selling Yourself

As part of creating my interactive CV, I’ve been looking at what other designers and web developers are doing to promote their skills. The best ones I’ve seen include an element of fun and interactivity with them, that make them interesting.

Here are a few of my favourites:

 

Screen Shot 2015-03-23 at 13.29.25

 

 

Screen Shot 2015-03-23 at 13.32.37

 

Screen Shot 2015-03-23 at 13.33.33

It’s interesting to see what people are doing to attract attention. Interactivity is a great idea, novelty is okay as long as it is done well, and obviously depends on the work you’re trying to get.

I’m going to aim for a more professional tone with my interactive CV, but on-trend and playful too – the same way I’ve had a bit of fun with my rollover image in the sidebar. I always mention Adham Dannaway’s portfolio website, (and obviously other people love it too when you see how many replicas there are) but I like the playful/professional combination. It just works.

23 Mar

Web Dev: Skeleton Boilerplate

I decided to experiment with Skeleton, a responsive CSS boilerplate.

It is extremely simple to use, and comes with a 12-column grid making it a perfect fluid layout template.

Skeleton's 12-column grid layout.

Skeleton’s 12-column grid layout.

I was able to quickly put together a starting layout, based on some sketches I mapped out previously. My initial sketches are below (taking the grid layout into consideration) followed by the initial desktop layout and a mobile version created starting with Skeleton.

layoutSketch

ScreenShotDesktop

ScreenShotMobile

I developed a system of blocks, that include a ‘border’ section of colour, and a white section to hold the text. As you can see, it is an extremely quick way to get together a responsive design. I’m going to work on gathering and creating the content with the client before I progress much more with the coding, but I’m happy that this is going to be a viable tool to build on and develop further.

22 Mar

Women’s History Month: Edmonia Lewis

Picture 215

I created this illustration of Edmonia Lewis in celebration of Women’s History Month, in the style of some of her work. Lewis was an African American sculptor specialising in marble portrait busts. She spent the majority of her adult working life in Rome, using the marble to create amazing neoclassical pieces.

Find out more about Edmonia Lewis here.

20 Mar

Portfolio Project: Interactive CV

I previously created an infographic CV last year, but now I’m moving it a step forward by making an interactive one. I’m using InDesign for this, as it has a lot of interactivity built-in. Buttons, links, rollovers and navigation are all quite simple to do, and there is a lot of help online to start even if you have never used InDesign before. I found this tutorial helpful when trying to create buttons.

There are, however, some known bugs that create issues with buttons. Make sure that you have the latest Adobe Reader installed or it will drive you mad.

Ashley Nye interactive CV design

I’m keeping to the same colour palette as my other websites and portfolio material. It will include a ‘featured’ section, some more information about my work and skills, and ways to contact me.

This is designed with a landscape orientation because it will primarily be viewed on a PC or laptop. Equally, it will still work as a printout.

Download my interactive CV below.

Ashley Nye Interactive CV

19 Mar

Portfolio Project: Flat Design

I quickly put together the following mood board to reflect the feel of my chosen ‘fish & chips’ restaurant (part of the group showcase portfolio project).

fishandchipsmoodboard

I then created the following designs in Adobe Illustrator, using the wireframes as a basis for the layout. They are all very flat, vector images. All three ‘restaurants’ will be designed in the same style, each with their unique colour palettes and atmospheres.

D&DHomepage Design-01

D&DFish and Chips Design-01

D&DMenu Design-01

 

18 Mar

Portfolio Project: Group Showcase

As part of the portfolio project, we’re creating a group showcase on the wonderful Edge Animate.

The application will include a restaurant theme, showing each of our three ‘dining experiences’. I created the following logo to encompass the group theme – a mix of food and coding/design.

Screen Shot 2015-02-13 at 17.45.21

The initial wireframes can be seen below.

mockupA4

17 Mar

She Codes Brighton’s Tech in 10

She Codes Brighton (@SheCodesBtn) put on a brilliant event last night, as part of the Spring Forward celebration of women in digital industries.

There was a fantastic variation of topics by the all-female speakers. The line up included ten minute technical talks on Ruby and Rails, Python and Django, WAI-ARIA, native mobile development, computer forensics, IT in education, Design for Hackers and an introduction to Arduino.

Highlights include:

  • a flip flopping, double splatting Glinda the Good
  • a dabble into real-life CSI
  • colour palettes on LSD
  • a demonstration on how to make Lego even more fun than it already is

Along with the informative and entertaining presentations was an atmosphere She Codes should be proud of. The friendly, supportive and welcoming vibes are exactly the way to encourage more women into programming.

Click here to visit their website and find out more.

 

13 Mar

Web Dev: Information Architecture

The first thing I did was write down all the different elements of the proposed website.

I then sorted them into logical categories, to get a rough idea of content and navigation. The result is below.

cardSort

I then created the following mind map on Mind42.com (a free online mapping tool) to sort these into something I could work with.

HomeThere isn’t a huge amount of content to sort, but allowing the user to get to the information they need quickly and easily increases satisfaction, and could ultimately be the difference between someone booking or choosing somewhere else.