UX & IA Design Thinking

I was recently on a project where there was a requirement to have many items in the main navigation. There was not an option to consolidate these into smaller groups. The idea was to move the search box up into the top ribbon bar. This would allow for more horizontal space for the navigation items. However in my attempt to move the search I found a little gotcha. I selected the search control in SharePoint Designer and moved it right above the welcome navigation control code. Wrapped the control in a div tag and temporarily added an inline style of float left. <div style="float: left;">    <asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server">       <SharePoint:DelegateControl runat="server" ControlId="SmallSearchInputBox" Version="4"/>    </asp:ContentPlaceHolder> </div> I saved the master page and then ...

I created a post about a year ago about Using Visio for SharePoint Wireframes . So now that 2010 has been released I got busy building the next generation Visio Wireframe Toolkit for SharePoint 2010. It is currently around ~40 pages that range from Wiki, team site, meeting workspaces, search, my sites, and application pages. All the text, navigation, web parts, and images are editable and can be added, moved, edited or deleted. In this version I made sure that the correct colors, fonts, and web part placements were true to the application. On most of the templates I have included some basic information about the page layout, web parts on the page, and libraries/lists included. Here are some samples: Team Site Contacts Web Database My Profile Silverlight Organization Viewer I wish I could share it with everyone but my hands are tied and I cannot. It is an EMC Consulting artifact and I am writing this blog post to mainly get the word out that Visio is st...

I have been searching for a simple tab web part for SharePoint but mostly came up empty handed… I was looking for something that a user can easily drag and drop a web part onto a specific tab within the page. There are quite a few free tab web parts out there but most of them were not just quite what I wanted. I checked out the following Tab web part solutions. Easy Tabs : From Path To SharePoint Pro: The tabs automatically take the name of the web part. Con: There is no option to add more than one web part per tab, and the User Interface is not that intuitive. Zone Tabs : From MSDN Pro: You have a lot of options for tab customization Con: It’s a web part that you have to install on the server. From what I remember it’s not that easy to re-arrange the web parts on the page. I finally found this article from Bits Of SharePoint Site : http://www.bitsofsharepoint.com/ExamplePoint/Site/TabPage.aspx His code was exactly what I needed. All...

It’s been a rough road getting this certification but I have officially passed both the MCTS 70-630 and 70-631 Microsoft Certification!

I have been working with Visio 2010 for a while now and I have to say that I am really happy the new features. I do all of my wireframes in Visio. These can be from 10-40+ pages. I used to struggle with duplicating pages in the past but now there is this great feature similar to how PowerPoint works. If you copy an object and past it on another page it places it in the same horizontal and vertical location from where you copied if from. In the past I had to create a temporary box and place it in the upper left corner of the page > copy both objects > paste those objects on another page and then line the temp. box back up in the upper left corner… I feel like I am in one of those Windows 7 Commercials. “I had this vision one day of Copying and Pasting an object and having it paste into the same location on another page. The next thing I know Microsoft released Visio 2010. I’m a PC and Visio 2010 was my Idea…” This not only works going from page to page but from one Visio do...

I hope this post will help many of you feel comfortable with using the Content Query Web Part. In this post I will walk you through the process of creating a content query web part and configuring it to show custom field types. I will also give details on how to use XSLT to stylize and format the data being pulled. I will be using the following scenario as an example. Say that you had a site collection with a top level publishing site. This publishing site would display a the most recent blog posts from all blog sites within its own site collection. To solve this problem we will use a Content Query Web Part and a customized ItemStyle.xsl using XSLT. Please note that the “SharePoint Server Publishing Infrastructure” needs to be enabled at the site collection to display the content query web part. Step 1: Add a Content Query Web Part to Page Navigate to the site that you want the blog posts to show up and click on edit page. Under Editing Tools in the Ribbon, Click on ...

As you design your sites it is very critical that you test, test, test. Here is a common issue that has caused a lot of people headache in the past. If you have ever had the issue of your datasheet background color being the same color as the body of your site here is a fix to get it back to normal. Say you wanted a SharePoint design that was fixed width and center justified. This is pretty easy as long as you don’t change the body color to anything other than white. Example: Fixed Width site with dark body background. You might think to use the following CSS: body{ background-color:#000; text-align: center; } .ms-main{ margin:0 auto; width: 980px; background-color:#FFF; } #mainTable{ width: 100%; } Well that would be great if you never wanted to use the datasheet viewer… Here is how it looks with the CSS from above: Whoa… Look familiar? Well with just using the following classes you can keep the background color for your site but n...