5

I want to design UI prototypes and wireframes, based on Use case diagrams, activity diagrams and sequence diagrams to represents the flow and process relation. Is it necessary to include the class diagram in the design?

0

2 Answers 2

6

Class diagrams are for:

a. Describing the low level design of a software component

b. Describing a data model.

Wireframes are for designing the interaction and experience of the user with the system. The use cases act as input for the wireframes.

The use cases can be detailed in text (actors, preconditions, main success scenario, postconditions, branches, exceptions) or in activity diagrams.

Sequence diagrams show how the use cases are implemented above the classes from the class diagrams and aren't really input for the UI design.


If you want to describe how a custom UI engine works then use class diagrams.

If you want to describe how a user interacts with a UI then use wireframes.

The class diagrams are for designing the implementation and the data model,
the wireframes are for designing the UX which (along with the use cases) are a part of the requirements definition which should precede the software design.

When you get to the UI low level design - designing the specific fields in a UI, you will want to take into account the UX design (wireframes) and the required data (data model - class diagrams) to make sure the UI is according to the desired experience and that it provides all the required inputs. You may even discover that some of the inputs don't match the desired UX and go back and adjust it e.g. by adding an additional window or control then return to the UI low level design and adjust according to the changes to the wireframe.

3
  • to describe in my world: I would use use case diagrams and activity diagrams to describe user interaction with UI which is an input for the wireframe design. right?
    – Paarmin
    Oct 22, 2013 at 18:55
  • @user2876656 Yes. Of course there can always be feedback in cases you discover that the inputs need changing (in all stages of design, implementation and testing). Oct 22, 2013 at 22:29
  • Yes, of course. Thanks for your participation. it was really helpful
    – Paarmin
    Oct 23, 2013 at 8:06
2

UML class diagramm isn't necessary for the UI design. Though, if it exists, it could be the source for the entities' atributes, which are exist in a domain. So, for example, Author and Book classes have attributes, which could be implemented in a UI. But there is no any data in the diagram which tell you what attributes should be on a form.
enter image description here

For UI designer who has UML class diagramm only as input spec for an UI, there is a danger of implementing UI, which strictly follows the data model, but brings bad UX. An example is implementing user registration form, which contains all the user profile attributes in the registration form.

So use UML class diagramm as additional source of information, but don't stick with it.

4
  • This is a class diagram which describes the data model which is displayed in the form. You could say it is an input for designing the specific UI for this data once you know that it belongs in a single form. Oct 22, 2013 at 16:07
  • I doubt, the author gender will be in a form. Though, you are right, it's a data model which should be somehow implemented as a form. Oct 22, 2013 at 16:09
  • And using the wireframes you decide if you select an existing author from a list, search for the author using name/email/gender or perhaps you can add a new author without leaving the form. Oct 22, 2013 at 16:11
  • @DannyVarod I've edited post ). Oct 22, 2013 at 16:21

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.