Category Archives: 2007

Why Do People Hate SharePoint?

 

Editor’s note: Contributor David Lavenda is Vice President of Product Strategy at harmon.ie. Follow him @dlavenda

During the third week of November 2012, Microsoft hosted its annual SharePoint conference, an extravaganza of everything and anything that has to do with SharePoint, at the Mandalay Bay Hotel in Las Vegas. The conference crowd was an avid and passionate group of SharePoint boosters and the buzz around the show was electrifying. People who recently spent their vacation there, might jump to the conclusion that everyone LOVES SharePoint.

However, working with customers all over the world, we often hear the opposite opinion about SharePoint. Typical business users don’t love SharePoint, when forced to use it, many will openly admit their aversion of SharePoint. Why’s that? Here is a list of common reasons why people hate SharePoint:

  1. Deployment time takes too long – According to a Forrester survey over 40% of respondents reported that deployments ran over the allotted time and approximately 60% of these respondents claimed it was due to technical difficulties. Delays in IT projects such as SharePoint deployments can cause organizations to lose valuable time and money.
  2. SharePoint can’t be used “out-of-the-box” – Organizations learn that it is very hard to use SharePoint “as is.” They quickly discover that third-party tools are needed to augment SharePoint to address their business requirements. According to AIIM, the biggest on-going technical issue with SharePoint implementation is governance, specifically the management of metadata and taxonomies, and over 54% of organizations are either using or planning to use a third-party add-on product.
  3. “The proverbial Swiss army knife solution to every content”- From document management, project management, blog, wiki and even corporate intranet; SharePoint promises to delivers on a wide variety of needs, yet the end result is often “nothing more than a landfill for documents.”
  4. Poor user experience- In a Forrester survey, when enterprises were asked “In what way is SharePoint not meeting your expectations?” over 30% said that their users don’t like the SharePoint experience. 30% said that their end users prefer other tools such as email. This isn’t surprising since the typical business users revert back to their original business workflow once they encounter difficulties with a newly introduced platform.
  5. Poor mobile device access to SharePoint- In a study done by AIIM, 90% of survey respondents expressed some level of dissatisfaction from SharePoint’s Mobile device access. The business users want to stay productive in the office or on the go.

What Does This Mean?

How can we reconcile these reactions to the tremendous value that SharePoint brings to organizations and to its almost universal deployment? The underlying root cause of people’s dissatisfaction with SharePoint stems from poor preparation and unrealistic expectations about what SharePoint provides ‘out of the box.’

To ensure a successful SharePoint implementation and happy users, employ the following ‘tried and true’ strategies:

  1. Create a well-defined deployment process that takes into account the needs of not only tech-savvy IT people, but also your typical business users.
  2. Make sure your project focuses on a business solution and addresses the business users’ needs, such as making it easy to access SharePoint from the office and also when on the road.
  3. Integrate SharePoint into the typical business users’ everyday workflows.
  4. Follow Gartner’s advice4 and look to third party tools to plug functional deficiencies in SharePoint.

Following those 4 guidelines, will ensure that even the harshest of critics will fall in love with SharePoint.

2013-10-04-DontLikeSharePoint-03.jpg

Tools for SharePoint User Experience (UX) Design: Interactive Prototyping


You may also be interested in: O’Reilly – SharePoint 2010 at Work


 

Editor’s note: Contributor Adrian England is the Senior User Experience Designer at Creative Sharepoint. Follow him @ade_england

Introduction

Following on from the previous articles in this series Scamping, Paper Prototyping and Wireframing, the topic for this article is Interactive Prototypes.

What is Interactive Prototyping?

In the previous articles in this series a concept was taken through the stages of initial scamps to get the ideas down on paper and iterated quickly, a paper prototype to explain individual elements of functionality and then the creation of wireframes to show how the content will sit within the site.

At this stage you will probably have a number of wireframes depicting the different pages within a site. These wireframes will undoubtedly have the correct content and layout in place, but it may be difficult to illustrate how the individual pages come together to form a complete site.

This is where the interactive prototype comes in. Using Axure to create the initial wireframes means that these pages can now be wired together to form a clickable, navigable site. Again these files should contain no element of design, these should be purely monotone layouts with no imagery or stylised fonts, ensuring the focus is on the content with the addition of interaction.

Taking the wireframe created in the previous blog we can now add functionality, links, interactions and more… For the purpose of this blog I will focus on making the site navigable but there is a lot more that can be achieved by Axure, their site has a number of tutorials (http://www.axure.com/learn) and a lot more resources can be found online.

2013-10-04-InteractivePrototyping-01.jpg

Using Axure to create an Interactive Prototype

First off we need to decide which elements of the site will be used across all (or multiple) pages. For the purpose of this wireframe the header containing the navigation, site logo and search area will be required as a consistent element across the entire site.

For larger projects these elements could include document libraries, lists, newsfeeds, calendars or any other element that should remain consistent.

Similar to the SharePoint Ribbon in our SharePoint2013 Axure Library any page element can be turned into a “Master”.

Taking the wireframe created earlier, drag and select all of the elements in the header area.

2013-10-04-InteractivePrototyping-02.jpg

Right click on this selection and “Convert to Master”, naming the item “Header”.

2013-10-04-InteractivePrototyping-03.jpg

This new Master element will be displayed in the Masters panel (to the left of the prototype). Rename the pages (in the Pages panel) as required, then right click on the Header Master (in the Master panel) and select the pages it should be added to. The Master element can also be dragged on to an individual page and repositioned if required.

2013-10-04-InteractivePrototyping-04.jpg

Now edit the master by double clicking on the master element, either on the page (highlighted in red) or in the Master panel, this will open the Master created earlier so you can edit all the pages globally.

Links can be added to the Navigation buttons by right clicking on them and adding cases. The Header will now be updated with links on all pages that it has been placed on allowing the site to be navigable.

2013-10-04-InteractivePrototyping-05.jpg

When finished adding content and functionality to each page, the prototype can be exported into a html prototype allowing the user to click through the site and explore.

Once tested by the user and approved the project can then progress to the design stage, confident in the knowledge that the content and functionality have been agreed. Going through this process and separating content, functionality and aesthetics allows the designs to be considered purely on their own merit and the underlying functionality understood without further explanation or iteration.

Challenges Securing SharePoint Against Privileged Insiders

 

Editor’s note: Contributor Mike Fleck is Co-founder of CipherPoint Software, Inc. Follow him @mfleckca

2013-08-27-SharePointSecurityImpact-01.pngIt is well documented at this point that some leaked Wikileaks data came from SharePoint sites. Details have emerged regarding how the data relating to the PRISM breach was obtained, and this breach, like Wikileaks, also involved SharePoint.

To provide some structure for this discussion, we’ll break the discussion into three types of collaboration platforms: legacy file servers, on-premises SharePoint sites, and cloud collaboration platforms such as Office 365 and SharePoint Online.

Legacy file servers

Insider security threats in legacy file server environments include classic systems administrator issues (excessive permissions, inability to enforce need to know, lack of separation of duties). Third party products exist that can help add a layer of security control to these environments. These products enforce need to know by using an independent access control and encryption capability, which is usually managed by IT security or by the business manager (data owner).

On-premises SharePoint

Purpose-built collaboration platforms such as SharePoint bring a multitude of security issues, many of which depend on the use case, and the deployment model.

For example, SharePoint when deployed as an intranet collaboration system presents a different set of potential security threats versus SharePoint as an extranet collaboration platform. Regardless, however, it’s hard to argue that the SharePoint platform, out of the box, has sufficient security controls to prevent insiders from accessing sensitive information that they have no valid “need to know” of.

Even if you implement background checks and other process-based controls to mitigate insider threats, consider that administrator credentials are among the most prized targets by external attackers. Given the porous nature of perimeter-only security defenses today, implementing technical security controls that limit the damage that can be done from compromised system administrator accounts is just smart security (and part of a defense in depth strategy). It’s also worth acknowledging that systems administrators frequently take the path of least resistance, by combining service accounts and privileges. This can easily lead to a situation where the sysadmin’s credentials are literally the “keys to the kingdom.”

Locking down premise SharePoint sites requires an additional layer of access control and encryption.

Cloud Collaboration (Office 365, SharePoint Online)

Cloud collaboration systems bring a different set of security issues. Whether SaaS or IaaS, it’s impossible to ignore the fact that in external cloud services, outsiders (in the form of cloud service provider system administrators) are your new insiders (and insider threat).

Here’s an article that describes the havoc that can be brought by a rogue cloud service provider system administrator.

As with premise file servers and SharePoint sites, applying encryption and access control to data stored in cloud collaboration systems is the only way (from a technical control standpoint) to protect access to sensitive data. There are a number of different technical approaches to securing cloud data. Future articles will explore the various ways to do this.

Insider Threats, SharePoint, and the Snowden and Wikileaks Security Breaches

 

Editor’s note: Contributor Mike Fleck is Co-founder of CipherPoint Software, Inc. Follow him @mfleckca

2013-08-27-SharePointSecurityImpact-01.pngAt a high level, the Snowden and Wikileaks security breaches both highlight the insider threat to sensitive information. The “insider threat” has been well understood (for a very long time) to be very serious (significant impacts are likely from insider security breaches). Also well known is the difficulty in implementing controls that fully mitigate the threat.

Without proper security controls in place, it is fairly easy for insiders to access sensitive information in SharePoint. Note that this problem is not specific to SharePoint. Most IT technologies can be compromised by a malicious individual with administrator privilege.

While both PRISM and Wikileaks involved government entities (a national intelligence agency and the DoD), the threat from insiders and system administrators is a universal one. Every year, we see numerous stories about insiders from a myriad of different companies and industries walking off with sensitive or valuable data.

A few key takeaways regarding the insider threat and SharePoint:

  • SharePoint security should start with understanding the information assets that exist on your SharePoint sites. It’s fundamentally not possible to assess risk without this understanding. I talk with many SharePoint users, and it’s frankly alarming how many have no real idea if there’s sensitive or regulated content stored on the platform, or where it exists. If you’re in this boat, you should scan your SharePoint content periodically looking for sensitive and regulated data.
  • Any organization with sensitive or valuable information in SharePoint is at risk. Certainly this includes defense and intelligence organizations, but it also includes commercial organizations with high-value IP, trade secrets, financial information, M&A information, Human Resources information, and many other categories of valuable information.
  • In any given organization, controls aimed at fully mitigating the insider threat will likely need to include both technical controls, and administrative controls. Most IT platforms do not provide native security controls capable of preventing administrators from accessing information for which they have no “need to know”. This is obviously true for SharePoint deployed with out-of-the box security controls implemented on-premises. It’s also true for cloud collaboration platforms such as SharePoint Online, Office365, Box, and others. In addition, technical controls will need to include a mix of preventive controls (access controls and encryption), and detective controls (audit and reporting).
  • Platforms like SharePoint can be used in high security applications. 3rd party security tools can enable businesses to expand their use of SharePoint, and to bring the benefits of collaboration to new use cases involving sensitive and regulated data (while maintaining security, even against malicious insiders).

Here’s a few external articles involving security breaches where malicious insiders were the source of attack:

The folks at Carnegie Mellon US CERT have done some good work in characterizing insider threats and attacks. They’ve also created an insider threat security architecture that describes the sorts of controls needing in an IT architecture to thwart malicious insiders. See their resources here.

Tools for SharePoint User Experience (UX) Design: Wireframing


You may also be interested in: Simple SharePoint Migration Tool – Content Matrix by Metalogix


 

Editor’s note: Contributor Adrian England is the Senior User Experience Designer at Creative Sharepoint. Follow him @ade_england

Introduction

Following on from the previous articles in this series on Scamping and Paper Prototyping, the topic for this article is the Wireframe.

What is Wireframing?

While a scamp is the first stage in designing a site, a quick way of getting the content and functionality required planned out, a wireframe is the next stage in the process when the detail and scale of elements need to be ascertained. Similar to a scamp, a wireframe should be quick and easy to change so the process of iterations with feedback from clients will allow quick refinement of the content required.

2013-09-04-SharePointWireframing-01.jpg

Like a scamp, a wireframe should have no design elements, such as colour, fonts or imagery, ideally these should be created in one colour, only using extra colours to denote different areas or functionality, by doing this the user is forced to focus on the content and not be distracted by design elements.

Where scamps and wireframes differ is that wireframes should contain the actual content that the site requires, list items, document names, names of departments and people, navigation items etc. (or as close as possible) so that the site feels as personable and as real as possible to the users.

Another reason for the content to be accurate at this stage is that the wireframes will be produced at SS (Same Scale) as the proposed design, so if the requirements are for the site to be optimised for a minimum browser size of 1024x768px with a minimum point size of 11px then the wireframe should be created to these specifications to ensure the content will fit when we get to the design stage.

Which tools can be used to create Wireframes?

The tools for creating wireframes are wide and varied and which tool you choose to use will depend on your skill set and the projects specific requirements. Below are some of the tools available with their pros and cons:

Photoshop

Although not the obvious choice for a wireframe, the wireframe taking slightly longer to create initially, the finalised wireframe can have design elements quickly applied by using Photoshop layer styles to add chromes etc.

Photoshop however does a lot more than just making wireframes and therefor is a lot more expensive and a lot harder to learn than other products, so if you don’t already have a copy of Photoshop and are unfamiliar with it this is probably not the right choice.

Fireworks

Fireworks is probably more suited to wireframes, using symbols and states to control the look of elements which can have the design added once finalised. Another advantage with Fireworks is that the wireframe can quickly be turned into an interactive prototype.

Similar to Photoshop, Fireworks is reasonably expensive and tricky to master.

Balsamic

Balsamic is a tool that is designed specifically for the purpose of wireframing, giving a selection of user interface elements that can be easily dragged and dropped into position to build a layout. Balsamic is a simple application and so, is a skill that can be quickly learned.

On the downside Balsamic produces wireframes that are a little closer to scamps in style so getting the content accurate is a bit harder.

Axure

Like Balsamic, Axure is designed specifically for wireframing, it comes with a selection of User Interface elements and you can create your own UI elements to add to these if required. You also have more control over the look and scale of items than Balsamic, being able to control global text styles etc.

It is a relatively simple application to learn and there are a wealth of online resources and tutorials too.

One big advantage of Axure is that once you have built your wireframes these can be quickly wired together to make an interactive prototype.

Using Axure to create Wireframe

I won’t go into too much detail on how to use Axure as there are lots of tutorials on this subject floating around the web, below I will illustrate the process of creating a simple wireframe from the scamp created in the previous article, using the tools that come with Axure and a few extra tools we have created that are SharePoint specific (which can be downloaded at the end of this document).

2013-09-04-SharePointWireframing-02.jpg
Above: The scamp from my previous post

Step 1: Create a blank Axure document

2013-09-04-SharePointWireframing-03.jpg

Step 2: Load the “SharePoint_Axure_Library” (downloadable at the end of this blog)

Click on the title of the Widgets Panel and scroll down to “Load Library” then navigate to and load the “SharePoint2013_Axure_Library”. This will add a number of UI Elements that are specific to SharePoint such as the ribbon, lists, libraries etc.

2013-09-04-SharePointWireframing-04.jpg

Step 3: Add the SharePoint Ribbon from the “SharePoint2013_Axure_Library”

Drag and Drop the Ribbon from the widget library on to the page.

2013-09-04-SharePointWireframing-05.jpg

Step 4: Add buttons from the Axure default widget library

Drag and Drop a button on to the page, the size and text can be edited once the button has been placed.

2013-09-04-SharePointWireframing-06.jpg

Step 5: Add the SharePoint Search Box from the “SharePoint_Axure_Library”

When dragging elements onto the page Axure has handy dialogue boxes and guides to allow pixel perfect positioning of UI elements.

Step 6: Use the Axure default widgets or create your own widgets to add more content

2013-09-04-SharePointWireframing-07.jpg

Conclusion

This process can be repeated to create all of the required pages of the site in one Axure document, if an element is used on multiple pages then it can be created as a master and edited in one place whilst updating any page it is placed on, these wireframes can either be exported as individual images or wired together to make an interactive prototype (the process of making an interactive prototype will be covered in the next blog in the series).

The wireframe is now much more detailed than the original scamp, and because it has been created to scale we can see that the all of the required content is no longer visible within a 1024×768 screen, finding this out now rather than at the design or build stage is beneficial as we can now quickly reassess and refine the content so the information that the client requires on the page fits within the minimum screen size specified.

Download the SharePoint2013 Axure Library here – please note, this file will only work in Axure, not the other wireframing tools mentioned earlier

SharePoint Security Impacts From Snowden and Wikileaks Breaches

 

Editor’s note: Contributor Mike Fleck is Co-founder of CipherPoint Software, Inc. Follow him @mfleckca

2013-08-27-SharePointSecurityImpact-01.pngThe biggest security story that we’ll see this year is the Snowden – NSA – PRISM leak. The biggest security story in the past couple of years prior to PRISM has clearly been Wikileaks. Common threads obviously run through these breaches, starting with the use of SharePoint by both organizations and the attackers in both cases compromising the confidentiality of information therein. The UK newspaper The Register reported a few weeks ago that the Snowden breach involved information obtained out of SharePoint servers. There are so many different angles to these security breaches, and they are so important, that we’ll address them in a series of blog posts over the next few weeks. Topics for these blogs include:

1)   The increasing importance of security controls that aim to keep system administrators honest or from mistakenly putting the organization at risk. While both Snowden and Wikileaks involved national intelligence agencies and the DoD, the threat from insiders and system administrators is a universal one. Every year, we see numerous stories about insiders from a myriad of different companies and industries walking off with sensitive or valuable data or just accidently making information publically accessible. This article describes the insider threat (posted and available here), and will discuss challenges to securing IT systems against insiders that are common to many organizations and IT platform

2)   It is well documented at this point that some leaked Wikileaks data came from SharePoint sites. NSA has also very recently admitted that data relating to the PRISM breach was obtained from SharePoint servers. It is now clear that the Edward Snowden a) was a system administrator, b) had system administrator privileges across a variety of systems, and c) did not have “need to know” for the information that was stolen and subsequently leaked, and d) obtained much of the information that he’s now leaking from a SharePoint server. This article describes specific challenges relating to securing information in collaboration platforms against system administrators, with specific focus on premise SharePoint sites. To many in the SharePoint world,  “SharePoint security” is synonymous with “SharePoint permissions” and the Snowden breach is a great example of how permissions are a single point of failure and do not (in and of themselves) equate to a proper security architecture.

3)   Solving the SharePoint insider threat issue. Protecting data in SharePoint requires the right mix of security controls, and the right architectural approach. Data encryption and access controls at the application layer are critical.

4)   In defense of SharePoint…Both the Snowden and Wikileaks breaches involved SharePoint. This doesn’t mean, however, that SharePoint is inherently flawed from a security standpoint. It does mean that a defense in depth approach needs to be taken with SharePoint, as with any other IT platform. This blog will explore what a rigorous defense in depth security architecture for SharePoint looks like. The key takeaway…SharePoint farms can be adequately secured to store even the most sensitive data, from a multitude of threats, including privileged insiders.

5)   Security of data in cloud services has been a big issue since cloud first emerged. From the perspective of the PRISM program, and the data collected, both enterprises and consumers using or planning to use cloud services have to be seriously concerned about their data in cloud services. You have to approach cloud services at this point by assuming that your data is being looked at by third parties, including cloud systems administrators, and by governmental agencies. This article will look at cloud data privacy and security issues in light of these developments.

6)   If you accept that cloud data is at great risk, you have a number of different ways to approach securing the data. Data encryption is the primary security tool to employ, and there are big and important choices to be made, including where to insert the encryption (on a client, in a proxy, in a SaaS service, or on the cloud computing infrastructure itself), and how and by whom your encryption keys and encryption routines are managed. This article will explore encryption implementation issues related to securing cloud data.

A final thought, and we believe an important one. This is not solely a SharePoint security issue. This is a gross generalization, but most IT platforms, and particularly collaboration-oriented platforms, are challenged to adequately secure against rogue systems administrators and insiders. The solution to securing SharePoint and other IT platforms against insiders will always boil down to careful application of security controls, including ones that are native to the platform, and 3rd party controls that further lock down the platform and data.

An analogy we use: if your house gets broken into, but you like the house, keep the house and buy a security system. People love SharePoint for the collaboration efficiencies the platform brings to the enterprise. Add to SharePoint the right set of administrative and technical security controls, and you’ve got a winning combination. It is possible to use the SharePoint platform for use cases involving highly sensitive data!

Tools for SharePoint User Experience (UX) Design: Paper Prototyping


You may also be interested in: fpweb.net


 

Editor’s note: Contributor Adrian England is the Senior User Experience Designer at Creative Sharepoint. Follow him @ade_england

Introduction

Following on from the previous article in this series scamping, the topic for this article is the Paper Prototype.

What is Paper Prototyping?

A paper prototype, like a scamp, is a low-tech way of quickly visualising an idea, or in this case, an area of functionality that would either be difficult to explain or would require investigation for proving a concept.

In essence, a paper prototype is a scamp with interactive functionality, which can be quickly created, tweaked and thrown away if not required.

The example below is an expanding list showing how the finished prototype will be used.

2013-08-27-SharePointPrototyping-01.jpg

What you will need

  • Cutting mat
  • Scalpel
  • Metal ruler
  • Glue (optional)
  • Marker pens
  • Medium weight card (around 200gsm)

Step 1

Draw a Scamp of the functionality area in its static state (on page load with no interaction).

2013-08-27-SharePointPrototyping-02.jpg

Step 2

Using the scalpel, metal ruler and cutting mat cut a line in the scamp along the top of the interaction area. This hole should be a little larger than the thickness of the card that is being used.

2013-08-27-SharePointPrototyping-03.jpg

Step 3

Next a scamp needs to be drawn for the interaction item, in this case this is the expanded list item.

Once drawn, the interaction item should be cut out so that the main body area is slightly narrower than the hole which was cut in Step 2 whilst leaving a bar at the top (this will allow the item to stop at the correct place).

2013-08-27-SharePointPrototyping-04.jpg

Step 4

Flip the two pieces of card over and feed the interaction item created in Step 3 into the hole created in Step 2.

2013-08-27-SharePointPrototyping-05.jpg

Step 5

Flip the paper prototype back over and have a play.

2013-08-27-SharePointPrototyping-06.jpg

Other Uses

Paper prototypes can be used to illustrate a vast range of functionality, the only limitation really is your creativity.

The process outlined above is only a very basic paper prototype; be creative and think up new ways of being able to demonstrate functionality.

Rolls of paper can be used to allow large areas of content to be scrolled through, long horizontal pieces of card can be good for demonstrating image carousels, tinted acetate or tracing paper can be used to replicate a modal window popping up…the possibilities are endless.

Top 5 UX (User Experience) Articles of the week – Week 10

 

Editor’s note: Contributor Marcy Kellar is a SharePoint Strategist and User Experience Designer. Follow her @marcykellar

2013-06-20-TopUX-Part02-01.pngLast summer, Marcy Kellar began a weekly series of her top picks of UX articles for that week. Marcy is going to pick up the series again so we’ve gone back to publish her original articles.

Here are the top 5 UX articles on branding this week:

1 – Complete Beginner’s Guide to Information Architecture

Information architects are more than just designers, visionaries, or project managers. Information architects must draw inspiration for perfecting their craft from a number of different departments. Typically, they will start as designers, or working alongside designers. At some level, the technical requirements of a sites design enter into their realm of interest and responsibility as well.

Marcy Kellar: Information Architecture is an important part of the User Experience. This is a useful article for those interested in Information Architecture or just beginning. It covers who is an Information Architect, what they do and what tools they use.

2 – Direct Your Audience To Important Content Through Visual Hierarchy

Every website communicates information through design. Some of the information will be very important and some not so much. Your audience won’t know which is which at a glance unless you provide cues for them by creating a visual hierarchy in your design elements.

Marcy Kellar: The visual layout of content can direct users to important content. This article provides helpful tips on creating visual cues so that users can find important content. The author uses his own blog as an example. The article doesn’t do the best job using relevant pictures but the content is still good.

3 – 40+ Creative and Best Landing Page Designs

Landing Page Designs – First thing you land on at what time you click on a advisement link is clearly your landing page. Landing page can make or break the image of website. If your landing page is high-quality and creative sufficient then only the visitor will stay for a while or will come back to visit once more.

Marcy Kellar:One of the best habits to get into as a designer is looking for inspiration. There are many places to look for design inspiration. I liked this collection because there were many design elements that were relevant to an internal SharePoint site.

4 – What the Heck Is CSS Specificity?

CSS specificity is a topic that many new front end coders avoid for as long as possible. It sounds complicated, there are all of these rules, you might even have to do some math! How lame is that? Ultimately, you can only avoid it for so long.

Marcy Kellar: CSS specificity is a useful technique in SharePoint branding and UI customization. I use this technique consistently when branding SharePoint. This article provides an overview of CSS specificity and provides several examples of how to use it.

5 – 9 Valuable CSS Tricks for Responsive Design

CSS also known as Cascading Style Sheets is now an integral part of web development as it allows developers to alter the elements in any web page, which were once impossible. If you know the correct source codes, you can easily make changes in text spacing, underline links and a lot of other stuff, which was non-changeable earlier.

Marcy Kellar: Responsive designing is growing in popularity with each passing day. This article provides tips related to CSS in responsive design. It’s worth a bookmark even if you aren’t working on responsive design now.

Top 5 UX (User Experience) Articles of the week – Week 9

 

Editor’s note: Contributor Marcy Kellar is a SharePoint Strategist and User Experience Designer. Follow her @marcykellar

2013-06-20-TopUX-Part02-01.pngLast summer, Marcy Kellar began a weekly series of her top picks of UX articles for that week. Marcy is going to pick up the series again so we’ve gone back to publish her original articles.

Here are the top 5 UX articles on branding this week:

1 – The Psychologist’s View of UX Design

You may have heard this story about an elephant: A king brings six men into a dark building. They cannot see anything. The king says to them, "I have bought this animal from the wild lands to the East. It is called an elephant." "What is an elephant?" the men ask.

Marcy Kellar: My background in psychology and life science appreciates the truth in this article on UX Design. I’ve been following the author, Dr Susan Weinschenk since her book, "Neuro Web Design: What Makes Them Click?" This article provides important points about users and why they do what they do. If you are concerned about adoption, this article is worth the read.

2 – How To Get People To Do Stuff: #1 — Use Nouns Instead Of Verbs

This blog post is the first of a new series called "How To Get People To Do Stuff". It will feature nuggets from the book I am writing by the same name due out in March of 2013. I’m also starting a new format of doing video blogs.

Marcy Kellar: The brain lady Dr Susan Weinschenk brings us another good one. This is the first article in a series I recommend reading if you are implementing SharePoint and devising a communication and adoption strategy. The wording of your communication matters.

3 – iPad User Experience Guidelines

Apple’s Human Interface Guidelines for the iPad outline how to create user interfaces optimized for the iPad device. According to Apple, the best iPad applications: downplay application UI so that the focus is on content; present content in beautiful, often realistic ways; and take full advantage of device capabilities to enable enhanced interaction.

Marcy Kellar:This is a comprehensive summary list of design considerations specific for the iPad. Most of these bullets also apply to other tablets.

4 – How Sans-Serif Typeface Styles Affect Readability

by anthony on 09/27/12 at 7:24 am Almost everywhere you look on the web, there’s a sans-serif typeface. Sans-serif typefaces have long been the standard for on-screen text due to their increased readability for low screen resolutions. But new research shows that not all sans-serif typefaces have equal readability.

Marcy Kellar: As SharePoint implementations reach multiscreen platforms and with it becoming easier to use unique fonts in web design, it’s important to consider the differences in sans-serif fonts ad understand the readability of them.

5 – Module Tabs in Web Design: Best Practices and Solutions

Digital today is a world of unprecedented complexity, which is a big opportunity. This research, sponsored by Google, shows different ways Americans use multiple screens.

A module tab is a design pattern where content is separated into different panes, and each pane is viewable one at a time. The user requests content to be displayed by clicking (or in some instances hovering over) the content’s corresponding tab control.

Marcy Kellar: Module tabs are used commonly in SharePoint designs to display several web parts while taking up less real estate. The type and use of content is important to consider when determining if this design pattern is an appropriate solution. This article provides an overview of the design pattern and best practices for use.

Tools for SharePoint User Experience (UX) Design: Scamping


You may also be interested in: Scinaptic OnePlaceMail – Enterprise Email & Document Management for SharePoint


 

Editor’s note: Contributor Adrian England is the Senior User Experience Designer at Creative Sharepoint. Follow him @ade_england

Introduction

This is the first in a series of articles exploring useful tools for designing a user experience for a SharePoint site.

I will explain what the tools are, why the tools should be used, in which circumstances they are best utilized, provide examples of usage and downloadable templates for use where possible.

What is Scamping?

In the context of User Experience a scamp is a quick, hastily drawn visual of a webpage.

Scamps should be the first stage of designing a SharePoint site (or any other site for that matter) when the content that is displayed on each page needs to be defined.

The content does not need to be pretty or drawn with perfectly straight lines (see below). In fact quite the opposite, we’re not aiming for a work of art here, it’s rough for a reason.

2013-08-09-SharePointToolsScamping-01.jpg

Creating these scamps in this crude way allows us to focus purely on content and if any element of visual design were added it would distract from this.

By only using a single color and having no styling applied a client will be led towards only giving feedback on the content of the page rather than being distracted by other elements and giving feedback on the color, imagery or the fonts used etc.

Another reason for doing these scamps quickly is that they will be disposable. An idea can be quickly agreed or disregarded by doing a quick scamp to assess its merits and throwing it away if it does not work. Many hours could be wasted by designing a perfect site with a full blown User Interface design only for the content to be changed and the time spent being wasted.

On a similar note, from the designer’s point of view, if you spend a few days on a design you will become attached to your design and you would be reluctant to make major changes to the layout. If these changes are made at the scamp stage, a 5 minute scamp is easier to throw in the bin and start again.

SharePoint Scamping Template

We have created a pdf template for quick and easy scamping which can be downloaded from the link at the end of the article and printed out. The template comprises of a browser window (1024px x 768px), pixel dimensions and a pixel grid to aid alignment and scale.

Also included in this template are layers that can be turned on/off in acrobat reader to add the Bookmarks Bar and the SharePoint Ribbon to the browser window.

2013-08-09-SharePointToolsScamping-02.jpg
Above: The basic scamp pad

2013-08-09-SharePointToolsScamping-03.jpg
Above: The basic scamp pad with bookmarks bar and SharePoint ribbon

Download the Creative Sharepoint scamp pad template here