質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
UI

UIはUser Interfaceの略であり、人間がコンピュータとやりとりをするためのシステムです。

Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

UI Design

UI Design(UIデザイン)は、ユーザインターフェースをデザインすることです。ユーザーとシステムがスムーズにコミュニケーションを取るために、OSやアプリ画面などを使いやすくデザインすることを指します。

Q&A

3回答

3254閲覧

WEBサービスの画面仕様の残し方

awnmst

総合スコア18

UI

UIはUser Interfaceの略であり、人間がコンピュータとやりとりをするためのシステムです。

Webサイト

一つのドメイン上に存在するWebページの集合体をWebサイトと呼びます。

UI Design

UI Design(UIデザイン)は、ユーザインターフェースをデザインすることです。ユーザーとシステムがスムーズにコミュニケーションを取るために、OSやアプリ画面などを使いやすくデザインすることを指します。

2グッド

6クリップ

投稿2015/12/14 10:01

自社で金融系の大規模サイトを運用しておりますが
画面遷移図、画面仕様はみなさんどうやって残しておりますでしょうか?

今はエクセルに画面キャプチャーを張り付けて
横に仕様を書いて画面仕様書として残すみたいなことをしておりますが
WEBベースで管理して、機能追加時影響範囲をざっと確認したり
コールセンターでも問い合わせ時確認できたり
以前とどう変わったのか履歴も管理したいです。

どんどん画面は機能改修で変わっていくので
そもそも画面キャプチャーとして残すべきかというのもあるのですが、
ログインが必要なサービスで会員によって使える機能が違っていたり
購入完了など実際に課金が走るページもあるので
できれば簡単に画面を見れるようにしておきたいです。

今の私のイメージとしてはこんな感じで管理できて
キャプチャー画像も流し込めて、画面遷移図も自動でできたら
良いなと思っているのですが、ご意見お聞かせください。
https://specfox.com/

sekitaka_1214, hsk👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答3

0

最初に画面設計書なり、詳細設計書なりを作成し、最後にそこの画面イメージを差し替えるパターンですね。

画面遷移図はそれはそれで別に作ってます。

テスト行為、結果としてのエビデンス(テスト結果資料)は、Excelにペタペタ、ですが、
その内容はテストケースに基づく表示内容なので、仕様書にはノーマルな表示のされ方を
テスト結果からチョイスするか、再度なんとか表示して張り付けてます。

比較結果は、IE6→IE10などのように差異をエビデンスとして作ることはありますが、
Excelに左右頁に張り付けて、なやり方です。

コールセンターや問い合わせ対応は、操作手順書などを作るか、QA表を作るか、
システムにコールセンター用アカウントを用意したり、システム自体に問い合わせ者と同じ操作が
できる仕組み(特定アカウントでログインすれば、その者と同じ表示ができる、ただし、更新は抑制する、など。
例えば ID 123456 なら 123456-support でログインでき、その人のなりすまし風な画面になる、感じ)を組み入れてます。

画面をHTMLに保存していき、紙芝居風にするのも、提案時のデモでは使います。(JavaScriptは動きますし)
HTML保存するレコーダーソフトなんかも有用かもしれませんね。

投稿2015/12/31 01:21

kanchan

総合スコア79

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

最終テスト(システムテスト等)の証憑として画面をキャプチャして、それを残している事が多いです。
思いつきで自分で試した事は無いのですが、静止画面キャプチャではなく、システムテスト全体を動画で残しておく方法は保存に手間がかからず文脈も見失わないので良いかもしれないなと思っています。

以下、回答ではないですが:
画面のイメージも画面遷移図も、仕様書の形で事前に定義されているのではないのでしょうか?
仕様書はあるが作りながら勝手に変えてしまっているということであれば、そちらを是正したほうが他の問題も解決するのではないかと思いました。

投稿2015/12/28 03:13

tokoi

総合スコア65

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

0

私はSelenium2画面キャプチャを使ってました。

前、働いていた会社は民間の個人情報を大量に扱っていた、レス主が気に入ったサイトとかは恐らく「iフィルター」によって、「web applicationのためブッロック」されます。
(その会社を辞めたの理由の一部はそのiフィルターです。)

レス主が金融関係であれば、もしかしたら、同じような状況になるのではないかな?

ただし、Selenium2も完璧ではなくて、サーバーのレスポンスが不安定の場合、都合のいいタイミングで撮ってくれません。特に画面遷移ではなく、別windowで開く場合はなお難しいです。
工夫が多少必要です。そして、excelに貼るのも囲むのも、手作業でした。><

例のサイトがopen sourceだったら、ローカルで構築して、動かせるかもしれませんね。


で、雑談ですが、「そもそも画面キャプチャー必要」って、それは恐らく「Yes」。
責任問題になるものなのです。
ただ、プログラマーにとっては、すごい面倒なことです。
自分は経営学部出身で、プログラマーとして働きながらも責任者のことを想像してたりします。

そのせいで、自分の中では常に「戦っています」。
(こんなのいらないでしょう? v.s. 作業内容を具体化しなきゃ)

システム開発ってお金の計算が具体化し辛いものです。評価も難しいです。
でも、雇用形式だと、基本は時間制か年収制で組まざるをえないです。

ずっとパソコンの前に座っているけど、遊んでるか、空想しているか、自分の趣味のプログラミングしているかとか、周りがわからないです。
プライドに邪魔されて、些細なミスで半日にハマった状況も恐らくあります。

私の思想では、人間は機械ではないから、会社に余裕があって、許容範囲内なら、上は多少見過ごせるものであろう。ただ、その許容範囲には人それぞれです。

なので、大規模pjなら上長の責任を考え、小規模pjでも自分の作業内容を証明するために、システムが詳しくなくても分かるような「残せるもの」を残せたほうがいいと私は考えています。

投稿2015/12/26 23:46

SoniaLiang

総合スコア27

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問