Though the original scope of the assignment was to design an app, I was also assigned the duty of designing a desktop version of a website that would be promoting the app. For this wireframe, I roughly laid out where the items would be on the home page.
The Nielsen Norman Group has released an article discussing the importance and flaws of using a huge hero image on the home page. I am sharing the important check list that is included in the article. Read the entire article about image usage “Image-Focused Design: Is Bigger Better?” now.
Follow these steps to make sure you have the right balance of elements:
“Am I Too Old For UX?”
According to the blog UX Beginner, “Yes, you are.”
But if you read the story further, entering the UX field is not really about how old you are, but rather how much experience you have. Don’t let your age intimidate you and keep your for pursuing a career in UX. Just get started today!
Read the Entire article now:
Am I Too Old For UX?” Yes, you are. by Osbourne Chen at UX Beginner
I found a great definitive list of design, tech, web and UX podcasts. I listen to a lot of podcasts on my drive to and from work, so this is going to be a great resource for people like me who like to catch up on their podcasts on their commute. Yes some are in German, but pick the English ones if that’s your cup of tea.
UX Radio: UX-, Design-, Usability Podcasts
Some of the podcasts that I think look particularly interesting are:
Coming up with great content can be really tough sometimes. It is hard to figure out what you want to say. I know that I struggle with that when I am developing blog posts. Normally I report on things that I am working on. Or I share graphics that I find interesting. This is one of those such graphics.
For the original story you can visit “22 Ways to Create Compelling Content When you Don’t Have a Clue”. What resources are you going to try to pull creative content from? I think I will personally skip the celebrities topics. You’re welcome.
When testing the Weather Channel App, I discovered a number of usability issues. Clearly, if the UX team had run some basic usability tests, a number of problems would have discovered and corrected.
• Make clickable items like buttons seem clickable.
• Remove ads within the feed, especially if they look like weather (editorial) content.
• Do not use ads as a background image on home page.
• Put useful information like search functionality in side drawer.
• Put more information, like a few days’ forecast on the home page.
• Use arrow indicator to notify the user to scroll down.
• Do not include every searched location in the favorites list.
• Allow user to just search a location without saving it.
• Allow users to include more than 10 locations in the favorites list.
• Clearly indicate current city with writing the city name, rather than relying on image.
• Give clues on social weather page as to what the icons mean and what will happen before a user clicks the icon.
• Make icons intuitive and less confusing and add a word them to clarify the function.
• Allow user to return to the top of page by tapping on the bar at the top of the screen.
• Move radar closer to top of feed. Or allow users to modify the order of content or remove something that does not interest them.
It’s great to get some ideas out of your head and on to some paper. I know it may seem strange. But sketching is a great way to brainstorm and to visualize how things actually fit together on the page or screen. Plus sketching is a great communication tool. Want to have a discussion about some of the ideas you have? Sketch them out and use them as talking points to move the project forward.
I used skating and the first phase to exploring some ideas for a history page I was working on for a website redesign.
After sketching a few ideas, one can take these rough sketches to the next level with wireframes. This is a great way to explore more ideas, yet not commit yourself to a high-fidelity design. I created this wireframe in Adobe InDesign because that program is quick and easy to use (for me) and has all the functionality one needs to create a wireframe.
The final step of the design phase included mocking up the page in Photoshop. Granted, the interaction and motion of the elements cannot be simulated in Photoshop. But a developer could work from this mockup with accompanying annotations and notes and discussion.
Is your company thinking of updating their website and you need to figure out what content already exists on your site?
AND what new content they want to include?
AND what old content should be carried over in to the new site?
Then is sounds like you need to do a content audit.
According to Wikipedia a content audit is the process of evaluating content elements and information assets on some part or all of a website.
In a related term, content inventory, is a quantitative analysis of a website. It simply logs what is on a website. A content inventory will answer the question: “What is there?” and can be the start of a website review. A content audit will answer the question: “Is it any good?”
Specifically, Slater states that the content audit can answer five questions:
I came across a great, and very in-depth resource to assist you with your content analysis. On The Moz Blog there’s a great article called “How To Do a Content Audit – Step-by-Step” and it chock full of great resources to help you get started.
Here is a breakdown of some of the topics covered:
Enjoy and good luck!
Sometimes it can be difficult to to get started on a web project. Where does one begin? Well maybe this crafty little info graphic from Designmodo can give you some pointers.
I find it helpful to always see what’s happening on the market now. It’s a good way to give me some inspiration, and see where things stand in the world of design right now.
Collaboration is truly valuable. I revisited the truth in that statement this week while working on the CoCo website redesign project I am involved in.
The task at hand was to get the website organized so that I could start thinking about new design possibilities for the site. But before I could do that, I had to have a clean and organized Information Architecture structure to work with. Sadly, the stakeholders did not understand the importance of not only doing a content analysis of the current site, but thinking about where they wanted the site to go. I understand it is very difficult for non design and web people to see the potential that change can bring. So I don’t blame them at all for not having the forsight to dream about the site’s potential. But if they could not do it, we had to.
So my fabulous content manager Wendy and I worked one evening to really get a site map organized. We talked about how the site exists now. We discussed the ways they organization wanted to change and the new features they wanted to include. And we debated what the navigation terms would be used.
It was a great collaboration and it was so helpful to have someone to hash out this process with. So in the case of working on a complicated process, like creating an organized and cohesive site map, two heads are better than one.
I came across a great resource the other day that I would like to share with you. UXPIN is a paid service for wireframing websites, tablet and mobile pages online. Though UXPIN is a paid resource, they do offer several valuable and FREE resources. One resource I would like to mention now is their free ebook “The Guide to Wireframing.”
Some of the resources I like in particular are:
Yes, it is kind of a pain to have to provide your email to get the book sent to you. But for the UI pattern aspect alone, I think it’s worth checking out. Enjoy.
Maybe you’re interested in a career in UXD, but where should you start? This infographic from Schools.com looks at how to go about becoming a user experience designer.
I am not sure if I agree with all components of this graphic, but is an interesting way to present a lot of information.
So many designers can relate to this information graphic about less than desirable clients. Sigh….
I just read a recommendation for the hand book Pixel Perfect Precision created by ustwo. Check out this jam-packed resources that has great information for all types of designers. What a great find!
Find Guidelines on the Web is a fabulous resource for finding many of the top brand names on the web right now.
Some of the brands featured:
There are some roadblocks in CoCo’s redesign progress. We need the organization to complete the content analysis. And then we need to figure out the new site map.
In the mean time, I wanted to sharpen my “Layout in Photoshop” skills so I mocked up a very rough draft of a page. I can see from my layout that it needs a lot of work. I feel like it’s very bland. But it’s a good way for me to get some practice in Photoshop.
How about listening to something education while you are at work? Lynda.com has a lot of great video tutorials on a lot of subjects – like UX, web design and business. I saw this slide on one of the courses the other day and thought it was a great reminder to share. When working on a UX project, one will often go through these phases:
This particular slide was found in “Foundations of UX: Content Strategy with Patrick Nichols” and is often referred to as the product development life cycle.
Check it out. You just might learn something!
I find that User Experience and User Interface are often used interchangeably. I was not even sure that I understood what the difference was. So I decided to do a bit of research on the internets and compiled a brief list describing each discipline. I know these are long lists. If you have some comments, please share with the group.
As part of my GluteninBeer app development, I wanted to create a story board. Please don’t judge me on my drawing ability! As I child, I was a pretty good illustrator. Now, as you can see, I am complete crap. Oh well….
But illustrating some ideas, in other words, getting them out on paper, is always a good idea. So I thought creating a story board would be a good step in the UX process.
I drew this by hand, first in pencil, then reinforced it in sharpie. The I scanned it in to Photoshop to clean it up a bit. I also added the color highlights in Photoshop. This will be part of a portfolio piece for the GluteninBeer app development
This is a portion of my group assignment for the Cal State Fullerton User-Centered Design class about Prototyping. Our team had a very quick three hours to come up with a prototype for a website. If you want to know more about the project, ask me in the comments.
Since you made it to this blog, it’s very likely that you came here through my home page at www.jenniferblatzdesign.com. But just in case you did not, and came in some special “back door” way, I wanted to emphasize that my portfolio site has a new design.
I opened with my UX portfolio. As you can see, I am accumulating a lot of UX assets and deliverables. One can also view some examples of my visual design work.
Thank you for taking the time to visit my newly-designed site. I would LOVE your feedback if you have any suggestions for improvement.
For CoCo’s redesign, I examined a number of website that CoCo said was similar to theirs, as far as the organization, not necessarily the design. It’s very helpful to see what other organizations that are similar to yours are doing on their website. What CoCo particularly liked about Homeboy Industries‘ website was the prominent “Donate” button that was on every page and was sticky at the top of the screen as the user scrolled down through the content.
It’s competitive analysis time! As part of any redesign, not only is it important to understand what your website is doing. It’s also helpful to see what other organizations that are similar to yours are doing on their website. For CoCo’s redesign, I examined a number of website that CoCo said was similar to theirs, as far as the organization, not necessarily the design. Here’s what Empower LA have going on at their website.
I wanted to create more than one persona since there are a few groups that use the CoCo website. So a part of my Community Coalition of South LA Taproot project, or better knows as CoCo I am working on some deliverables to accompany the project. Based another one of the stakeholder interviews I performed this week, plus additional resources that were provided by the organization, I came up with this fitting Persona.
As part of my Community Coalition of South LA Taproot project, or better knows as CoCo I am working on some deliverables to accompany the project. Based on one of the stakeholder interviews I performed this week, and other resources provided by the organization, I came up with this fabulous Shelia Persona.
The wonderful Strategic Projects team of UXPALA (User Experience Professionals Association of Los Angeles) spent a good part of Sunday afternoon working on the “not quite ready for primetime” uxpala.org website. Though it is still in it’s very early stages, the team came together to get a lot of work accomplished. We have to pull information form the already existing meetup website, plus create new content that must also be included on our formal website. All if this while working with the Information Architecture and structure of the site. Though there is yet a lot of work to be done, we made some great headway.
Though these wireframes are not perfect, and I know that I still need to read the iOs developer handbook to improve upon the standards. I need to make my wireframes a bit more compliant to these standards. However, it is good to explore some visual options and get started by getting some ideas on paper.
As part of my class project, I also had to create a wireframe for a desktop version. Though my concept really focuses on just the mobile app, I was tasked with creating a computer version that would promote the app. Below is the wireframe for this desktop website that would be promotion the app and leading viewers on where they could download the app.
I just found out that I’ll be conducting stakeholder interviews for my taproot project Community Coalition or better known as CoCo of South LA. It’s exciting to be part of this project.
But I have to admit I am a bit nervous about conducting my first interviews. I am sure it will be fine. I just hope I don’t bore the interviewee with a long laundry list of questions.
I am working on my coding skills a bit by creating this comparison table for the website Gluteninbeer. Like the name suggests, this blog focuses on the gluten level of beers. The interest here is not gluten-free beer. Nope. The site tests the gluten levels in popular and commercial beers that are not considered gluten free. I work with my partner to create the branding and content.
In this instance, aside from creating the logo and branding, I also coded up this handy little chart. After receiving multiple requests from our readers to create a summary chart, we decided to do so. The table breaks down the beer tests results so for. It is a quick comparison of which beers are safer or not safe at all for people with a gluten intolerance. Please note that this site does claim that these beers are safe for celiacs. The members of gluteninbeer.blogspot.com are just testing the gluten levels in beer for their own personal interest and consumption.
I came across this nice and simple slide presentation called, “The 10 User Experience Principles à la WordPress.” It visually illustrates Jakob Nielsen’s Heurstic Evaulation Principles. The best part of her slideshow is it gives concrete examples to illustrate each principle.
First thing I wanted to do before tackling the Hollywood Walking Tour App was to observe how tourists do research or way find on the boulevard. I wanted to see how people navigated the area. As suspected, some tourists were holding up unfolded maps or looking at books. Some people were part of a larger tour group, being lead around by a hired guide. Some were standing to the side looking at a smart phone. Perhaps they were researching the area? And others were just wondering down the street checking out all of the starts on the sidewalk along the way.
I wil leb starting my next California State Fullerton class very soon. It’s called Prototyping User-Centered Design Solutions and obviously it involved prototyping. I am excited to be learning more about this great field and to hopefully gain some skills that will be applicable to a new job. Below is the text book for the class.
As part of discovery for my Hollywood Walking Tour App, I thought it would be a good idea to compare other apps that are available on the market. Granted, I only looked at free apps. But I want my app to be free, so this really is my competition. I was really shocked and surprised how poor the apps were for apps concerning walking tours in Los Angeles, and specifically Hollywood. The Hollywood walk of fame is surely bar far one of the biggest tourist destinations in Los Angeles. And it is best seen of foot. So I was really disappointed in the apps on the market now covering this topic.
Below I am comparing several apps that either have to do with Los Angeles tours, walking tours, or a combination of both.
Though I never used to be of the “school” of sketching out my designs, I am finding that sketching out a few alternative ideas to a mobile or tablet interface is helping me explore some alternatives. Maybe it is because I am so comfortable designing in print, that I can just crate the layout in my head and execute the layout immediately. Mobile is a bit more foreign and new to me, so it is helpful to explore possibilities. Plus, with the ways that mobile and tablet are interactive and involve swiping and motion, they come with their own set of rules. The learning curve for interaction design is quite different than traditional print design.
I am sad that the April newsletter for UXPALA did not make it out the door due to delayed responses et. al. But I am proud that I wrote several summary articles covering various UX events that took place in the spring 2014. If the UXPALA newsletter did come out last month, this is what it would have said:
Working on my user journey flow for my Hollywood walking tour app.
This is a great infographic.
On Design Thinking on MOOC today, students were introduced the the evolution of the the Economy. See the graphic below:
Joseph Pine and James Gilmore suggested in their book ‘the Experience Economy’, that the economic value creation in developed countries went from an agrarian economy, to an industrial economy, to a service economy, to an experience economy.
The agrarian economy is mainly concerned with producing and dealing with commodities. Extracting natural resources is here the major economic driver. The value creation in the industrial economy is based on the production of goods. When the goods market is saturated the next level of value creation is the service economy, which refers to an increased importance on the delivery of services. And last but not least there is the experience economy, where the experience becomes a significant economical differentiator.
The reason could be seen in a natural evolution, that as soon as basic needs are met, humans seem to strive for improvement and development.
So far we’ve covered a few topics in Udacity’s “Design of Everyday Things” with Donald Norman. The course can be summed up with the following:
And now the course continues, and the following topics are going to be focused on:
I almost forgot to start the MOOC Course offered through Udacity.com “Design of Everyday Things” with Don Norman. There’s only a few more days to complete the course so don’t delay.
For the Hollywood Walking Tour app I am now developing, I thought it would be a great idea to go to one of Hollywood’s biggest tourist traps, I mean spots. I spent a couple of hours observing tourists and talking to them about their traveling experience. Specifically, I wanted to see how people navigated the streets (Did they use a map or guide book? Or were they just wandering aimlessly?) and find out how they researched their trip to Hollywood. Here are some observations I made:
I am working through some Information Architecture (IA) for my Cal State Fullerton class. For the app in development, the Hollywood Walking Tour, I need to organize the interface and interactions. Here is a first draft of the IA:
Though I don’t feel like this is complete, this was the site map I turned in for the Web and App design class. I think this structure is a good start, but I wonder how it will evolve as I really start wire framing the interface and performing the usability tests. Until then, we will take every step in the process.
This is a portion of my first assignment for the Cal State Fullerton User-Centered Design for Web and Mobile Interfaces class. The charts here correspond to my chosen class project: A Hollywood Walking Tour App. I can’t seem to find a good and FREE walking tour app. So I thought about creating one myself.
The charts here discuss what the goals of the business are and what the customer goals would be. Though these charts are not perfect, their are a good first draft for the project.
The first of three award winning designs I would like to share with you is my website www.jenniferblatzdesign.com. This was my first ever web design award, and I won’t it from GDUSA Magazine’s Inhouse Design Awards. I have won several awards from them through the years. But this is the first year I’ve won a web design award from the organization. I am proud and inspired to design more great looking websites. Thanks for the confidence boost. Back to work….
This is the second Graphic Design USA award winning design for 2013. The concept here was a jovial and festive “Save the Date” reminder for a company’s holiday party. I needed to express the festive season, without promoting any religious affiliation. This design was well received.
The logo I designed for Website weekend won a 2013 Graphic Design USA award. Just announced today, the logo and branding for “Hike It Up” won an American Inhouse Design Award. I am pleased to add this to my gallery of award-winning designs.
