vim magazine.
the source for style at michigan state university.
about vim.
VIM is an entirely student-run fashion, beauty & lifestyle publication at Michigan State University. They publish a bi-annual print magazine, along with two bi-annual digital issues. The staff is compromised of students interested in advertising, graphic design, photography, finance, marketing, public relations, video production, social media, event planning, professional writing & editing, and more.
The semester I created this project is also the semester I worked as a print designer for the magazine. My spreads can be found on my graphic design page.
Deliverables:
Personas
Wireframes
Prototype
Tools:
Balsamiq
Figma
Visual Studio Code
Github
Deliverables:
Personas
Wireframes
Prototype
Tools:
Balsamiq
Figma
Visual Studio Code
Github
identifying the problems.
Something I thought about was when I first visited the VIM website my sophomore year was- it wasn’t very user-friendly and hadn’t changed since. Some issues I decided I wanted to address was:
1. Does the layout of the website make sense to both new users and existing ones?
2. Are users able to achieve their goals easily when navigating the site?
3. How do I make the site both usable and visually appealing enough to make the users crave more?
I then looked into the purpose of VIM and from there, developed personas to generalize the types of users that come to the site and their needs, as well as took note of design choices from competitor sites.
PERSONA 1
Current club members
PERSONA 2
Prospective club members
PERSONA 3
Team members
wireframes.
After researching a bit, I came up with a layout for each of the pages I wanted to recreate: the homepage, the about page, a blog post page and a category page. and Here’s a couple wireframes I made of a homepage and an example blog post page. I found that wireframing makes the process of creating a website a lot easier, as it gives me a visualization of where I want things to go without having to pull actual images and create actual text.
reflection.
A few things changed from the wireframes due to my limited knowlege of HTML & CSS at the time. However, it was my first big web design project and I’m very proud of all the knowlege I’ve gained from it. A lot of things I incorporated, I learned on my own through YouTube tutorials and forums like StackOverflow. I was even able to teach myself a bit of Javascript!
If I could change anything, though, I would conduct real research on real users so that I could get accurate information on the needs and wants instead of just assuming. Then from there, do user testing and redesign as needed.
get in touch.
I love opportunities to connect and strengthen my design skills and build new skills along the way. So, feel free to shoot me an email!
E john6238@msu.edu
Made by Anaija Johnson in WordPress. 2020.